前言
请记住:
任何时候,变量只能通过使用
var
、let
、const
关键字才能被声明。
正文
我们都知道, 无论在全局上下文,还是其他任何上下文中,都可以通过省略变量声明关键字的形式(类似 a = 1
)给全局对象添加一个新“属性”。请注意,严格来说这个 a
不能称作“变量”,原因是它不符合 ECMAScript 规范中变量的概念。
举个例子:
var a = 1 b = 2 delete a delete b console.log(a) // 1 console.log(b) // ReferenceError: b is not defined
严格来说,示例中
b
不能被称为变量。它只是全局对象下的一个属性。
示例中,变量 a
并没有被删除掉,而 b
却被删除了,为什么呢?问题先放一放
delete 操作符
我们先看看 delete
操作符是怎样工作的,语法如下:
delete object.property delete object['property']
它的作用是删除对象的某个属性。一般情况下它的返回值都是 true
,表示对象某个属性被移除成功。若该属性是一个自身的不可配置的属性,这时非严格模式下返回 false
(即属性移除失败),而严格模式下会抛出 TypeError
。
上面这句话有两个关键词:“自身”、“不可配置”。
- 自身:是指对象本身的属性,而非原型上的。可通过
Object.prototype.hasOwnProperty()
判断。- 不可配置:其实对象属性都有一个属性描述对象,属性描述对象其中包含一个
configurable
属性,若为false
,则表示该属性不可配置。可通过Object.getOwnPropertyDescriptor()
获取。
var a = 1 b = 2 window.hasOwnProperty('a') // true window.hasOwnProperty('b') // true Object.getOwnPropertyDescriptor(window, 'a') // { configurable: false, ... } Object.getOwnPropertyDescriptor(window, 'b') // { configurable: true, ... }
var obj = {} obj.__proto__.prop = 'proto' delete obj.prop // true,尽管 obj 本身没有 prop 属性,仍会返回 true obj.prop // "proto",delete 不会删除原型上的属性
区别
回到文中开头的问题:变量 a
为什么没有被删除掉?
尽管 var a = 1
和 b = 2
都会往 window
对象下添加对应属性,但是变量相比于简单属性来说,变量有一个特性:DontDelete
,这个特性的含义就是不能通过 delete
操作符直接删除变量属性。
eval
另外还要注意,eval
上下文中的变量声明和函数声明没有 DontDelete
特性,因此是可以删除的。
eval('var a = 1; function foo() {}') delete a // true delete foo // true
但是 eval
上下文内的函数体内部的变量或函数是不能删除的。
eval('function foo() { var inner = 2; console.log(delete inner); console.log(inner) }') foo() // false
总结
- 全局上下文或函数上下文中,变量声明或函数声明总含有 DontDelete 特性。
- eval 上下文的变量声明或函数声明不含 DontDelete 特性,因此可以被 delete 删除。
- 不要相信全局对象下的
delete
操作。 - 编写代码时,不要写出类似
a = 1
省略声明关键字的语句。