达维营-前端网delete 操作符用于删除对象的属性。
似乎很多同学（包括我）对 delete 操作符都是似是而非，为什么有的属性可以被删除，有的却不能被删除？为什么能够删除对象的属性却不能删除变量或函数？在 eval 和 严格模式下，delete 操作符又有哪些特性？等等。。
本文将从基本概念到 ECMPScript 内部原理来学习 delete 操作符。
语法
表达式
delete object.property // 点操作符方式，常用方式 delete object['property'] // 字符串属性名方式
参数
- object:对象名称，或者返回一个对象的表达式
- property:将要删除的属性
返回值
delete 操作符返回 true 或 false。当被 delete 的对象的属性存在并且拥有 DontDelete (对象属性的一个内部属性，拥有该内部属性表明该属性不能被删除) 时返回 false（在严格模式下将抛出异常），否则返回 true。需要注意的是，对象属性不存在时也返回 true，所以返回值并非完全等同于删除成功与否。
delete 删除了什么
delete 操作符用来删除对象的属性，这里所说的属性实际上是属性本身，而不是属性指向的对象（对于引用类型来说）。所以，对于引用类型的值，delete 删除了对象属性的本身，不会删除属性指向的对象。
var o = {};
o.x = new Object();
delete o.x; // 上一行new的Object对象依然存在
o.x; // undefined，o的名为x的属性被删除了
在实际的 JavaScript中，delete o.x 之后，Object 对象会由于失去了引用而被垃圾回收， 所以 delete o.x 也就“相当于”删除了 o.x 所指向的对象，但这个动作并不是 ECMAScript 标准，也就是说，即使某个实现完全不删除 Object 对象，也不算是违反 ECMAScript 标准。
下面代码说明了 delete 只删除属性本身，而不会删除属性所指的对象：
var o = {};
var a = { x: 10 };
o.a = a;
delete o.a; // o.a属性被删除
o.a; // undefined
a.x; // 10, 因为{ x: 10 } 对象依然被 a 引用，所以不会被回收
虽然是一个小小的 delete 操作符，其行为却异常复杂。
为什么我们能删除一个对象的属性：
var x = { a: 1 };
delete x.a; // true
x.a; // undefined
但却不能删除一个变量：
var x = 1; delete x; // false; x; // 1
也不能删除一个函数：
function x() { };
delete x; // false;
typeof x; // "function"
要知道其中的原委，我们需要先了解一些基本概念。
代码类型
在 ECMAScript 中，有 3 种不同类型的可执行代码：
- 全局代码 (Global code)：当一段源代码被看成程序 (Program) 时，它将会在全局作用域内执行，并且被认为是全局代码。在浏览器环境中，脚本元素的内容通常被解释为程序，因此被作为全局代码来执行。
- 函数代码 (Function code)：在一段函数中直接执行的代码就被认为是一段函数代码，在浏览器环境下，节点的事件属性（如 <a onclick=”…”）通常都作为函数代码来解析和执行。
- Eval代码 (Eval code)：被内置函数 eval 执行的代码文本被解释成 Eval 代码
执行上下文 (Execution context)
代码的执行都是在特定的执行上下文中进行的，对于以上三种代码类型都有一个执行上下文与其对应。比如，当一个函数被执行时，程序控制就进入了函数代码执行上下文；当一段全局代码被执行时，程序控制就进入了全局代码执行上下文，等等。
执行上下文在逻辑上是一个栈（stack）。首先可能有一段全局代码，它拥有属于自己的执行上下文；在这段代码中可能调用一个函数，这个函数同样拥有属于自己的执行上下文；这个函数可能调用另一个函数，等等。即使当函数递归调用自己时，在每一步调用中仍然进入了不同的执行上下文。
执行上下文与作用域链和闭包等概念息息相关，欲深入了解执行上下文可以查阅作用域链和闭包的相关资料。
活动对象 (Activation object) / 变量对象 (Variable Object)
每个执行上下文都有一个与之相关联的变量对象 (Variable object)，在某个执行上下文中申明的变量和函数将被当着属性 (properties) 附加到这个变量对象上面。
当在全局代码的执行上下文时，全局对象 (Global object) 成为当前执行上下文的变量对象，在浏览器中就是 window 对象。因此，声明的全局函数和变量就成为全局对象的属性。
/* this 指代全局对象 */
var GLOBAL_OBJECT = this;
var foo = 1;
GLOBAL_OBJECT.foo; // 1
foo === GLOBAL_OBJECT.foo; // true
function bar(){}
typeof GLOBAL_OBJECT.bar; // "function"
GLOBAL_OBJECT.bar === bar; // true
局部变量（那些在函数代码中定义的变量）是怎么样的呢？当在函数代码的执行上下文时，活动对象 (Activation object) 成为当前执行上下文中的变量对象，在函数代码中申明的变量和函数成为活动对象的属性，并且函数的参数（形参名为属性名）和 Arguments 对象（arguments 为属性名）也将成为活动对象的属性。
注意，活动对象只是一个内部描述机制，在程序代码中不能直接访问。
(function(foo) {
var bar = 2;
function baz() {};
/*
抽象的过程
'arguments' 对象成为所在函数的活化对象的属性：
ACTIVATION_OBJECT.arguments = arguments;
...参数 'foo' 也是一样：
ACTIVATION_OBJECT.foo; // 1
...变量 'bar' 也是一样：
ACTIVATION_OBJECT.bar; // 2
...函数 'baz' 也是一样：
typeof ACTIVATION_OBJECT.baz; // "function"
*/
})(1);
在 eval 代码中申明的变量会根据 eval 所在的执行上下文来确定变量将成为哪个变量对象的属性。例如：
在全局环境中执行 eval，那么变量将成为全局对象的属性：
var GLOBAL_OBJECT = this;
eval('var foo = 1');
GLOBAL_OBJECT.foo; // 1;
在函数作用域中执行 eval，变量将成为活动对象的属性：
var GLOBAL_OBJECT = this;
(function () {
eval('var bar = 2;');
/*
抽象过程
ACTIVATION_OBJECT.bar; // 1
*/
})();
// 全局环境下不能访问 bar
this.bar // undefined
属性的内部属性
我们马上就接近本文主题了，从上面我们知道声明的变量成了变量对象（全局对象或活动对象）的属性，同时每个属性都可以拥有一个或多个内部属性：ReadOnly、DontEnum、DontDelete 和 Internal。这里我们关注的是 DontDelete 这个内部属性，拥有这个内部属性的变量表明该变量不能使用 delete 操作符删除。
当被声明的变量和函数成为变量对象的属性时，这些属性在创建时就带上了 DontDelete 这个内部属性。然而，任何显式/隐式赋值的属性不生成 DontDelete。这就是为什么我们能够删除一些属性，但有的却不能删除。
上面的分析可能不好理解，直接看下面的代码：
var GLOBAL_OBJECT = this;
/* 'foo' 是全局对象的一个属性，
它通过变量声明而生成，因此拥有内部属性 DontDelete
这就是为什么它不能被删除
*/
var foo = 1;
delete foo; // false
typeof foo; // "number"
/* 'bar' 是全局对象的一个属性，
它通过变量声明而生成，因此拥有 DontDelete
这就是为什么它同样不能被删除
*/
function bar() {};
delete bar; // false
typeof bar; // "function"
/* 'baz' 也是全局对象的一个属性，
然而，它通过属性赋值而生成，因此没有DontDelete
这就是为什么它可以被删除
*/
GLOBAL_OBJECT.baz = "baz";
delete GLOBAL_OBJECT.baz; // true
typeof GLOBAL_OBJECT.baz; // "undefined"
内置对象和DontDelete
所以，某些属性不能被删除的根本原因在于：这些属性拥有内部属性 DontDelete，该内部属性控制着该属性是否可以被删除。注意：内置对象的一些属性拥有内部属性 DontDelete，因此不能被删除； 特殊的 arguments 变量（活化对象的属性）拥有DontDelete； 任何函数实例的 length (返回形参长度)属性也拥有 DontDelete：
(function() {
//不能删除'arguments'，因为有DontDelete
delete arguments; // false;
typeof arguments; // "object"
//也不能删除函数的'length',因为有DontDelete
function f() {};
delete f.length; // false;
typeof f.length; // "number"
}) ();
与函数 arguments 相关联的属性也拥有 DontDelete，同样不能被删除：
(function(foo, bar) {
delete foo; // false
foo; // 1
delete bar; // false
bar; // "bah"
}) (1, "bah");
未声明的变量赋值
我们知道，直接给未声明的变量赋值会成为全局对象的属性，除非这一属性在作用域链内的其他地方被找到。而我们之前提到过，属性赋值和变量声明的区别：后者生成 DontDelete而前者不生成，这也就是为什么未声明的变量赋值可以被删除。
var GLOBAL_OBJECT = this; /* 通过变量声明生成全局对象的属性，拥有 DontDelete */ var foo = 1; /* 通过未声明的变量赋值生成全局对象的属性，没有 DontDelete */ bar = 2; delete foo; // false delete bar; // true
注意：内部属性是在属性生成时确定的，之后的赋值过程不会改变已有的属性的内部属性。理解这点非常重要。
/* 'foo'创建的同时生成 DontDelete */
function foo() {};
/* 之后的赋值过程不改变已有属性的内部属性，DontDelete仍然存在 */
foo = 1;
delete foo; // false;
typeof foo; // "number"
/* 但赋值一个不存在的属性时，创建了一个没有内部属性的属性，因此没有 DontDelete */
this.bar = 1;
delete bar; // true;
typeof bar; // "undefined"
原型中声明的属性和对象自带的属性
原型 prototype 中声明的属性和对象自带的属性(其实这些属性也是在原型 prototype 中的)可以认为是带有 DontDelete特性的，无法被删除。例如：
//原型中声明的属性无法被删除
function C() { this.x = 42; }
C.prototype.x = 12;
var o = new C();
o.x; // 42, 构造函数中定义的o.x
delete o.x;
o.x; // 12, prototype中定义的o.x，即使再次执行delete o.x也不会被删除
//对象自带的属性无法被删除
var re = /abc/i;
delete re.ignoreCase;
re.ignoreCase; // true, ignoreCase无法删除
Eval 和 Firebug 控制台
在 console 中的所有文本都会被当做 eval 代码来解析和执行，而不是全局或函数代码。我之前说过，eval 在处理变量声明时有一个特殊的行为：在 eval 中声明的变量事实上没有 DontDelete 属性。所以，下面声明的所有变量最后都没有DontDelete 这个内部属性，所以它们都能被删除。所以要小心普通的全局代码和 Firebug 控制台中代码的区别。
eval('var foo = 1;');
foo; // 1
delete foo; // true
typeof foo; // "undefined"
在函数代码中也是一样：
(function() {
eval('var foo = 1;');
foo; // 1
delete foo; // true
typeof foo; // "undefined"
}) ();
但是这也有一点例外，在 eval 代码中的函数内部通过 var 定义的变量具有 DontDelete，不能被删除。
eval("(function() { var x = 42; delete x; return x; })();");
// 返回 42
浏览器兼容性
了解事物的工作原理是重要的，但实际的实现情况更重要。浏览器在创建和删除变量/属性时都遵守这些标准吗？ 对于大部分来说，是的。
这里有一个简单的测试集来检查全局代码、函数代码和 Eval 代码的遵守情况。 测试单元同时检测了 delete 操作的返回值和属性是否像预期那样被删除。delete 的返回值并不像它的实际结果那样重要，delete 操作返回 true 或 false 并不重要， 重要的是拥有/没有 DontDelete 的属性是否被删除。
现代浏览器总的来说还是遵守删除规则的，以下浏览器全部通过测试： Opera 7.54+，Firefox 1.0+，Safari 3.1.2+，Chrome 4+。 Safari 2.x 和 3.0.4 在删除函数 arguments 时存在问题，似乎这些属性在创建时不带 DontDelete，因此可以被删除。Safari 2.x 还有其他问题——删除无引用时（例如 delete 1）抛出错误（译者按：IE 同样有）；函数声明生成了可删除的属性（奇怪的是变量声明则正常）；eval 中的变量声明变成不可删除（而 eval 中的函数声明则正常）。
与 Safari 类似，Konqueror（3.5，而非4.3）在 delete 无引用和删除 arguments 是也存在同样问题。
Gecko DontDelete bug
Gecko 1.8.x 浏览器—— Firefox 2.x, Camino 1.x, Seamonkey 1.x, etc. ——存在一个有趣的 bug：显式赋值值给一个属性能移除它的 DontDelete，即使该属性通过变量或函数声明而生成。
function foo() { };
delete foo; // false;
typeof foo; // "function"
this.foo = 1;
delete foo; // true
typeof foo; // "undefined"
令人惊讶的是，IE5.5-8 也通过了绝大部分测试，除了删除非引用抛出错误（e.g. delete 1，就像旧的 Safari）。 但是，虽然不能马上发现，事实上 IE 存在更严重的 bug，这些 bug 是关于全局对象。
IE bugs
在 IE 中（至少在 IE6-8 中），下面的表达式抛出异常（在全局代码中）：
this.x = 1; delete x; // TypeError: Object doesn't support this action
下面则是另一个：
var x =1; delete this.x; // TypeError: Cannot delete 'this.x' // 译者按：在IE8下抛出此异常，在IE6,7下抛出的是和上面一样的异常
这似乎说明，在 IE 中在全局代码中的变量声明并没有生成全局对象的同名属性。 通过赋值创建的属性（this.x = 1）然后通过delete x 删除时抛出异常； 通过变量声明（var x = 1）创建的属性然后通过 delete this.x 删除时抛出另一个（译者按：在 IE6,7 下错误信息与上面的相同）。
但不只是这样，事实上通过显式赋值创建的属性在删除时总是抛出异常。 这不只是一个错误，而是创建的属性看上去拥有了DontDelete 内部属性，而按规则应该是没有的：
this.x = 1; delete this.x; // TypeError: Object doesn't support this action delete x; // TypeError: Object doesn't support this action
另一方面，未声明的变量赋值（那些同样生成全局对象的属性）又确实在IE下能够正常删除：
x = 1; delete x; // true
但如果你试图通过 this 关键字来进行删除（delete this.x），那么上面的异常又将抛出：
x = 1; delete this.x; //TypeError: Cannot delete 'this.x'
如果归纳一下，我们将发现在全局代码中 delete this.x 永远不会成功。当通过显式赋值来生成属性（this.x = 1）时抛出一个异常； 当通过声明/非声明变量的方式（var x = 1 or x = 1）生成属性时抛出另一个异常。而另一方面，delete x只有在显示赋值生成属性(this.x = 1)时才抛出异常。
宿主对象(Host Object)
小小总结一下 delete 操作符：
- 如果操作数不是引用类型，则返回 true
- 如果对象没有同名的直接属性，返回 true （对象可以是活动对象或全局对象）
- 如果属性存在但是有 DontDelete 特性, 返回 false
- 其它情况，删除属性并且返回 true
然而，对于宿主对象（host object）的 delete 操作的行为却可能是不可预料的。
我们已经看到了在IE中的一些问题：当删除某些对象（那些实现为了宿主对象）属性时抛出异常。 一些版本的 firefox 当试图删除window.location 时抛出异常（译者按：IE 同样抛出）。 同样，在一些宿主对象中你也不能相信 delete 的返回值， 例如下面发生在 Firefox 中的(译者按：Chrome 中同样结果；IE 中抛出异常；Opera 和 Safari 允许删除，并且删除后无法调用，姑且算’正常‘，尽管，从下面的讨论来看似乎却是不正常的，它们事实上删除了不能删除的属性，而前面的浏览器没有)：
/* 'alert'是’window‘的一个直接属性（如果我们能够相信'hasOwnProperty'） */
window.hasOwnProperty('alert'); // true
delete window.alert; // true
typeof window.alert; // "function"
delete window.alert 返回 true，尽管这个属性没有任何条件可能产生这个结果（按照上面的算法）：它解析为一个引用，因此不能在第一步返回 true；它是 window 对象的直接属性，因此不能在第二步返回 true；唯一能返回 true 的是当算法达到最后一步同时确实删除这个属性，而事实上它并没有被删除。（译者按：不，在 Opera 和 Safari 中确实被删除了…）。
所以这个故事告诉我们永远不要相信宿主对象。
ES5 严格模式
在 ES5 严格模式下，当删除操作指向一个变量/函数参数/函数声明的直接引用时抛出 SyntaxError。 此外，如果属性拥有内部属性[[Configurable]] == false，将抛出 TypeError：
(function(foo) {
"use strict"; //在函数中开启严格模式
var bar;
function baz;
delete foo; // SyntaxError，当删除函数参数时
delete bar; // SyntaxError，当删除变量时
delete baz; // SyntaxError，当删除由函数声明创建的变量时
/* function实例的length拥有[[Configurable]] : false */
delete (function() {}).length; // TypeError
}) ();
而且，在严格模式下，删除未声明的变量（换句话说，未解析的引用），同样抛出 SyntaxError；同时，在严格模式下未声明的赋值也将抛出异常 ReferenceError：
"use strict"; delete i_dont_exist; // SyntaxError i_dont_exist_either = 1; // ReferenceError
看了之前给出的变量、函数声明和参数的例子，相信现在你也理解了，所有这些限制都是有其意义的。严格模式采取了更积极的和描述性的措施，而不只是忽略这些问题。
总结
下面是对于 JavaScript 中 delete 操作是如何工作的简短的总结：
- 变量和函数声明都是活化对象(Activation Object) 或全局对象(Global Object)的属性
- 属性拥有内部属性，其中 DontDelete 这个内部属性负责确定一个属性是否能够被删除
- 在全局或者函数代码中的变量和函数声明总是创建带有 DontDelete 特性的属性
- 函数参数总是活动对象的属性, 并且带有 DontDelete
- 在 Eval 代码中声明的变量和函数总是创建不带 DontDelete 特性 的属性
- 新的未声明的属性在生成时带空的内部属性，因此也不带 DontDelete 特性
- 永远不要相信宿主对象对 delete 操作做出的反应
如果你想要对这里所描述的东西更加熟悉的话，请参阅 ECMA-262 3rd edition specification。