JavaScript Delete 运算符
JavaScript delete 运算符用于从对象中删除/移除属性。它会从对象中删除属性以及属性的值。它仅适用于对象,不适用于变量或函数。
在 JavaScript 中,数组是一个对象,因此你可以使用 'delete' 运算符从特定索引中删除元素。但是,有一些方法如 pop()、slice() 或 shift() 可用于从数组中删除元素。
语法
按照以下语法使用 'delete' 运算符删除对象属性。
delete obj.property;
OR
delete obj["property"];
如果您尝试删除不存在的属性,它将返回 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>
它将产生以下结果 -
请注意,当我们访问 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>
上述程序将产生以下结果 -
删除数组元素
我们可以使用 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>
它将产生以下结果 -
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 :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
可以删除没有 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>
它将产生以下结果 -
ReferenceError: x is not defined