JavaScript中的delete操作符：原理、行为与限制

为什么delete对某些元素无效

在处理代码时，开发者常会遇到以下现象：

// 可以删除对象属性
var o = { x: 1 };
delete o.x; // true
o.x; // undefined

// 无法删除var声明的变量
var x = 1;
delete x; // false
x; // 1

// 无法删除函数声明
function y() {}
delete y; // false
typeof y; // "function"

当delete返回true时表示删除成功，返回false则表示失败。要理解这一差异，需要深入JavaScript的执行环境模型。

执行上下文与作用域链

JavaScript代码运行在特定的执行上下文（Execution Context）中。主要分为三种类型：

• 全局代码（Global Code）：脚本顶层代码，执行时会进入全局执行上下文。
• 函数代码（Function Code）：函数体内部的代码，每次调用都会创建新的执行上下文。
• Eval代码（Eval Code）：在eval()函数内部执行的代码，继承所在上下文的特性。

这些上下文逻辑上构成一个栈结构。每个执行上下文都关联一个变量对象（Variable Object），它是存储当前环境中所有标识符（变量、函数、参数）的内部容器。

第1步：理解全局上下文中的变量对象

在全局执行上下文中，全局对象充当变量对象。这意味着通过var或function在全局作用域声明的标识符，实际上变成了全局对象的属性。

/* 注意：在全局作用域中，this指向全局对象 */
var GLOBAL_OBJECT = this;

var foo = 1;
GLOBAL_OBJECT.foo; // 1
foo === GLOBAL_OBJECT.foo; // true

function bar() {}
typeof GLOBAL_OBJECT.bar; // "function"

第2步：理解函数上下文中的激活对象

在函数执行上下文中，变量对象被称为激活对象（Activation Object）。它存储了函数的局部变量、形参、arguments对象以及内部声明的函数。

(function(foo) {
    var bar = 2;
    function baz() {}
    
    /* 抽象来看，ACTIVATION_OBJECT 包含：
       - arguments对象
       - 形参 foo
       - 局部变量 bar
       - 内部函数 baz
    */
})(1);

第3步：评估Eval代码的影响

Eval代码不拥有独立的变量对象，它共享被调用者的上下文。因此，在eval中声明的变量会直接添加到外部上下文的变量对象中。

var GLOBAL_OBJECT = this;
eval('var foo = 1;');
GLOBAL_OBJECT.foo; // 1

(function() {
    eval('var bar = 1;');
    // bar成为了当前函数激活对象的属性
})();

核心机制：DontDelete特性

决定delete能否生效的关键在于属性的特性（Attributes）。每个属性都有元数据标记，其中最相关的是DontDelete。

• DontDelete为真：表示该属性不能被delete删除。通常出现在通过var声明的变量或function声明的函数上。
• DontDelete为假：表示该属性可以被delete删除。通常出现在动态赋值的对象属性上。

第4步：对比不同创建方式的属性

var GLOBAL_OBJECT = this;

// 1. 通过var声明 -> 带有DontDelete -> 不可删除
var foo = 1;
delete foo; // false
typeof foo; // "number"

// 2. 通过function声明 -> 带有DontDelete -> 不可删除
function bar() {}
delete bar; // false
typeof bar; // "function"

// 3. 通过属性赋值 -> 无DontDelete -> 可删除
GLOBAL_OBJECT.baz = 'blah';
delete GLOBAL_OBJECT.baz; // true
typeof GLOBAL_OBJECT.baz; // "undefined"

关键在于：特性是在属性创建时确定的，后续赋值不会改变原有的DontDelete状态。

function foo() {}
foo = 1; // 覆盖值，但DontDelete特性依然存在
delete foo; // false (依然不可删除)

this.bar = 1; // 动态创建新属性，无DontDelete
delete bar; // true (可删除)

内置属性与特殊环境的限制

除了手动创建的属性，许多内置属性和特定语境下的变量也拥有DontDelete特性：

1. Arguments对象：在函数内部，arguments具有DontDelete特性，无法删除。
2. 函数Length属性：如 fn.length，具有DontDelete特性。
3. 函数参数：函数的形参作为激活对象的属性存在，且带有DontDelete特性，无法删除。

(function(){
    delete arguments; // false
    function f(){}
    delete f.length; // false
})();

(function(param1, param2){
    delete param1; // false
    delete param2; // false
})(1, 2);

Eval环境下的例外情况

在eval中直接声明的变量或函数，由于没有设置DontDelete特性，是可以被删除的。这解释了为什么浏览器控制台（如Firebug或Chrome DevTools）中可以直接删除变量——因为控制台本质上是使用eval执行命令的。

eval("var x = 1;");
console.log(x); // 1
delete x; // true
console.log(typeof x); // undefined

eval("function test(){}");
delete test; // true

注意：仅在eval顶层声明的可删，eval内部或普通函数体内的局部变量仍遵循标准规则（不可删）。

delete与C++ delete的区别

C++中的delete用于释放指针指向的内存对象，而JavaScript的delete仅作用于对象的属性引用，并不直接销毁对象本身。

var o = {};
o.x = new Object(); // 创建一个新对象并赋值给o.x
delete o.x; // 删除o的属性引用
o.x; // undefined

// 此时，原Object对象若再无其他引用，会被垃圾回收。
// 但这并非delete的直接行为，而是GC机制的结果。

验证这一点：

var o = {};
var a = { x: 10 };
o.a = a;
delete o.a; // 删除o指向a的引用
o.a; // undefined
a.x; // 10 (a仍然持有对象引用，对象未被销毁)

原型链中的delete陷阱

delete只能删除对象自身的属性。如果属性存在于原型链上，delete操作会返回true（因为没报错），但并不会删除原型上的属性，对象访问时会回退到原型查找。

function C() { this.x = 42; }
C.prototype.y = 13;

var obj = new C();
delete obj.y; // true (自身没有y，操作静默成功)
obj.y; // 13 (从原型链继承的值仍在)

// 若要真正移除原型属性，需直接操作原型：
delete C.prototype.y;

总结与建议

• delete主要用于删除对象动态添加的属性。
• 不要试图用delete删除var/let/const声明的变量或function声明的函数。
• 在浏览器控制台中看到的“可删除”行为是因为控制台使用了eval环境。
• delete不影响原型链上的属性，也不直接管理内存生命周期（那是GC的职责）。

以上就是对JavaScript中delete操作符的详细解读，更多关于JavaScript基础语法的资料请关注本站其它相关文章！