JavaScript - Delete 运算符

JavaScript Delete 运算符

JavaScript delete 运算符用于从对象中删除/移除属性。它会从对象中删除属性以及属性的值。它仅适用于对象，不适用于变量或函数。

在 JavaScript 中，数组是一个对象，因此你可以使用 'delete' 运算符从特定索引中删除元素。但是，有一些方法如 pop（）、slice（）或 shift（）可用于从数组中删除元素。

语法

按照以下语法使用 'delete' 运算符删除对象属性。

delete obj.property;
	OR
delete obj["property"];

返回值 − 如果成功删除了操作数（指定的属性），则 'delete' 运算符返回 true，否则如果未删除该属性，则返回 false。

如果您尝试删除不存在的属性，它将返回 true，但不会影响对象。

按照以下语法使用 'delete' 运算符删除数组元素。

 delete arr[index];

删除对象属性

JavaScript delete 运算符可用于删除对象的属性。要删除该属性，我们编写 delelte 运算符，后跟对象的属性。

delete obj.propertyName;
or
delete obj["propertyNmae"];

在上面的 syntas 中，名为 propertyName 的对象属性将从名为 obj 的对象中删除。

示例：删除对象属性

以下示例中的 'obj' 对象包含 product、price 和 color 属性。我们使用 'delete' 运算符从对象中删除 price 属性。

<html>
<body>
<div id="output"></div>
<script>
	 	const obj = {
	 	 	 product: "Mobile",
	 	 	 price: 20000,
	 	 	 color: "Blue",
	 	}
	 	delete obj.price; // deleting price	
	 	document.getElementById("output").innerHTML =
	 	"The Mobile price is " + obj.price + " and color is " + obj.color;
</script>
</body>
</html>

它将产生以下结果 -

The Mobile price is undefined and color is Blue

请注意，当我们访问 deleted 属性时，它返回 undefined。

示例：删除不存在的对象属性

尝试删除不会退出的属性。它将返回 true，但不会影响原始对象。

<html>
<body>
<div id="output"></div>
<script>
	 	const obj = {
	 	 	 product: "Mobile",
	 	 	 price: 20000
	 	} 	
	 	document.getElementById("output").innerHTML = delete obj.color;
</script>
</body>
</html>

上述程序将产生以下结果 -

true

删除数组元素

我们可以使用 delete 运算符从数组中删除或删除元素。要删除元素，我们使用 delete 关键字，后跟 array 元素。我们可以使用方括号（[]）来访问数组中的元素。

例

下面的代码包含数字数组。我们使用 'delete' 运算符从数组的第一个索引中删除元素。在输出中，您可以观察到数组中的元素被删除，但其他元素的位置保持不变。数组长度也保持不变。

<html>
<body>
<div id="output"></div>
<script>
	 	const arr = [10, 20, 30, 40, 50, 60];
	 	delete arr[1]; // deleting 2nd element from array
	 	document.getElementById("output").innerHTML =	
	 	arr + "<br>" +	
	 	arr[1];	
</script>
</body>
</html>

它将产生以下结果 -

10,,30,40,50,60
undefined

删除预定义对象

JavaScript 的 'delete' 运算符可以删除 predifiend 对象，例如 Math、Date 等。不建议删除预定义对象。删除后，您将无法访问这些对象的属性。

示例：删除内置 Math 对象

在下面的示例中，我们尝试删除 Math 对象，因此我们得到了上述错误。

<html>
<body>
<div id="output"></div>
<script>
	 	var x = 10
	 	var fun = function(){return 20;};
	 	document.getElementById("output").innerHTML =	
	 	"delete Math.PI :" + delete Math.PI + "<br>" +	
	 	"delete Math :" + delete Math + "<br>";
		
	 	try{
	 	 	 document.getElementById("output").innerHTML += Math.PI;
	 	}
	 	catch(e){
	 	 	 document.getElementById("output").innerHTML += e;
	 	} 	
</script>
</body>
</html>

它将产生以下输出 -

delete Math.PI :false
delete Math :true
ReferenceError: Math is not defined

无法删除变量和函数

delete 运算符无法删除变量或函数。

<html>
<body>
<div id="output1"></div>
<div id="output2"></div>
<script>
	 	var x = 10
	 	var fun = function(){return 20;};
	 	document.getElementById("output1").innerHTML = delete x;
	 	document.getElementById("output2").innerHTML = delete fun;
</script>
</body>
</html>

它将产生以下结果 -

false
false

可以删除没有 var 、 let 或 const 定义的变量。这样的变量被视为 window 对象的属性。

<html>
<body>
<div id="output1"></div>
<div id="output2"></div>
<script>
	 	try{
		 	 	x = 10
		 	 	document.getElementById("output1").innerHTML = delete x;
		 	 	document.getElementById("output2").innerHTML = x;
	 	}catch(e){
	 	 	 document.getElementById("output2").innerHTML = e;
	 	}
</script>
</body>
</html>

它将产生以下结果 -

true
ReferenceError: x is not defined

<< JavaScript - Nullish 合并运算符 JavaScript - 逗号运算符 >>