Javascript中的delete操作符详细介绍


Posted in Javascript onJune 06, 2014

一、变量

说到javascript中的delete操作符,还是首先要搞清楚javascript中的变量和属性之间的关系。

javascript中,变量和对象属性关系非常微妙,甚至可以很多时候会被等同起来,因为 javascript 在执行脚本之前会创建一个global对象,在浏览器中就是window对象,所有的全局变量都是这个global对象的属性,执行函数时也会创建一个activation对象,所有的局部变量都是这个activation对象的属性。这些可以大家可以去了解一下javascript作用域和闭包。

 
//原型中声明的属性无法被删除var global = 1;
this.global; // 1, 可以通过this来访问global对象
this.global2 = 2;
global2; // 12
function foo() {
var local = 36;
// 不过无法直接访问activation,
// 因此无法通过 foo.local 的方式来访问local变量
}

似乎变量就等同于对象属性,其实不然,至少对于delete操作符来说还是不一样的。我的理解是变量声明是必须通过 var 语句来完成的,未通过var 语句声明的全局变量都是都是window对象的属性。这样就很容易的理解变量和对象属性的关系了。

二、delete操作符

delete操作符是用来删除对象属性的。对于引用类型的值,它也是删除对象属性的本身,不会删除属性指向的对象。如果有疑问可以看看基本类型和引用类型的值,或者测试下面的代码:

 
var o = {};
var a = { x: 10 };
o.a = a;
delete o.a; // o.a属性被删除
console.log(o.a); // undefined
console.log(a.x); // 10, 因为{ x: 10 } 对象依然被 a 引用,所以不会被回收

另外,delete o.x 也可以写作 delete o["x"],两者效果相同。

三、变量是不能删除的

通过var声明的变量和通过function声明的函数拥有dontdelete特性,是不能被删除。未通过var声明的全局变量(全局对象的属性)

 
var global = {
    a: 123,
    b: {
        c: 1345
    }
};
delete global; //无效
console.log(global)obj = {
    a: 123
};
delete obj; // 删除obj全局变量,window对象的obj属性
console.log(obj);//obj is not defined

 

四、原型中声明的属性和对象自带的属性无法被删除

原型prototype中声明的属性和对象自带的属性(其实这些属性也是在原型prototype中的)可以认为是带有dontdelete的特性的,无法被删除。例如

 
//原型中声明的属性无法被删除function obj() {
    this.x = 1;
}
obj.prototype.x = 2;
var o = new obj();
console.log(o.x); // 1, 构造函数中定义的o.x
delete o.x;
console.log(o.x); // 2, prototype中定义的o.x,即使再次执行delete o.x也不会被删除
//对象自带的属性无法被删除
var strings = "123456";
console.log(strings.length);//6
delete strings.length;
console.log(strings.length);//依然是6

五、eval语句下的几个例外

eval执行的代码中,通过var声明的变量虽然与正常的var声明变量同属于global对象,但它们不具有dontdelete特性,能被删除。但是eval的代码中的函数内通过var定义的变量具有dontdelete,不能被删除。

eval("var x = 42;");
x; // => 42
delete x;
x; // => referenceerror: x is not defined
eval("function f() { return 12; }");
f(); // => 12
delete f;
f(); // => referenceerror: f is not defined
//eval执行的代码中,通过var声明的变量虽然与正常的var声明变量同属于global对象,
// 但它们不具有dontdelete特性,能被删除。
eval("(function () {" +
    " var x = 42;" +
    " delete x;" +
    " return x;" +
    "})();")
// => 42
// eval的代码中的函数内通过var定义的变量具有dontdelete,不能被删除。

六、delete的返回值

delete是普通运算符,会返回true或false。当被delete的对象的属性存在并且拥有dontdelete时 返回false,否则返回true。 这里的一个特点就是,对象属性不存在时也返回true,所以返回值并非完全等同于删除成功与否。

 
function c() {
    this.x = 42;
}
c.prototype.y = 12;
var o = new c();delete o.x; // true
o.x; // undefined
"x" in o; // false
// o.x存在并且没有dontdelete,返回true
delete o.y; // true
o.y; // 12
// o自身没有o.y属性,所以返回true
// 从这里也可以看到prototype链的存在,对象自身属性和prototype属性是不同的
delete o; // false
// global.o拥有dontdelete特性所以返回false
delete undefinedproperty; // true
// global没有名为undefinedproperty的属性因此返回true
delete 42; // true
// 42不是属性所以返回true。有的实现会抛出异常(违反ecmascript标准)
var x = 24;
delete x++; // true
x; // 25
// 被删除的是x++的返回值(24),不是属性,所以返回true
Javascript 相关文章推荐
JavaScript 读取元素的CSS信息的代码
Feb 07 Javascript
JavaScript中常用的运算符小结
Jan 18 Javascript
jQuery获取注册信息并提示实现代码
Apr 21 Javascript
前台js调用后台方法示例
Dec 02 Javascript
JS在onclientclick里如何控制onclick的执行
May 30 Javascript
AngularJS 实现JavaScript 动画效果详解
Sep 08 Javascript
浅析JavaScriptSerializer类的序列化与反序列化
Nov 22 Javascript
jQueryMobile之窗体长内容的缺陷与解决方法实例分析
Sep 20 jQuery
Vue自定义toast组件的实例代码
Aug 15 Javascript
vue观察模式浅析
Sep 25 Javascript
vue+element实现表单校验功能
May 20 Javascript
java遇到微信小程序 "支付验证签名失败" 问题解决
Dec 22 Javascript
Javascript的严格模式strict mode详细介绍
Jun 06 #Javascript
jQuery实现购物车多物品数量的加减+总价计算
Jun 06 #Javascript
JavaScript代码编写中各种各样的坑和填坑方法
Jun 06 #Javascript
按钮接受回车事件的三种实现方法
Jun 06 #Javascript
jquery统计用户选中的复选框的个数
Jun 06 #Javascript
javascript中的throttle和debounce浅析
Jun 06 #Javascript
单击某一段文字改写文本颜色
Jun 06 #Javascript
You might like
PHP Token(令牌)设计
2008/03/15 PHP
PHP Ajax中文乱码问题解决方法
2009/02/27 PHP
php中关于普通表单多文件上传的处理方法
2011/03/25 PHP
php牛逼的面试题分享
2013/01/18 PHP
解析php框架codeigniter中如何使用框架的session
2013/06/24 PHP
PHP读取配置文件类实例(可读取ini,yaml,xml等)
2015/07/28 PHP
PHP模板引擎Smarty内置变量调解器用法详解
2016/04/11 PHP
py文件转exe时包含paramiko模块出错解决方法
2016/08/12 PHP
php实现的AES加密类定义与用法示例
2018/01/29 PHP
PHP ob缓存以及ob函数原理实例解析
2020/11/13 PHP
javascript中利用数组实现的循环队列代码
2010/01/24 Javascript
jquery实现控制表格行高亮实例
2013/06/05 Javascript
angularjs在ng-repeat中使用ng-model遇到的问题
2016/01/21 Javascript
jquery $.trim()去除字符串空格的实现方法【附图例】
2016/03/30 Javascript
AngularJS基础 ng-mouseenter 指令示例代码
2016/08/02 Javascript
ES6下React组件的写法示例代码
2017/05/04 Javascript
angular1配合gulp和bower的使用教程
2018/01/19 Javascript
JS阻止事件冒泡的方法详解
2019/08/26 Javascript
jQuery 筛选器简单操作示例
2019/10/02 jQuery
JS+CSS实现3D切割轮播图
2020/03/21 Javascript
JS实现放大镜效果
2020/09/21 Javascript
[01:34:42]NAVI vs EG 2019国际邀请赛小组赛 BO2 第二场 8.15
2019/08/17 DOTA
Windows系统配置python脚本开机启动的3种方法分享
2015/03/10 Python
Python根据服务获取端口号的方法
2019/09/25 Python
Python 3 使用Pillow生成漂亮的分形树图片
2019/12/24 Python
python实现拼图小游戏
2020/02/22 Python
彻底搞懂python 迭代器和生成器
2020/09/07 Python
深入浅析CSS3中的Flex布局整理
2020/04/27 HTML / CSS
英国著名音像制品和图书游戏购物网站:Zavvi
2016/08/04 全球购物
Draper James官网:知名演员瑞茜·威瑟斯彭所创品牌
2017/10/25 全球购物
英国在线房屋中介网站:Yopa
2018/01/09 全球购物
大二学生学习个人自我评价
2014/01/19 职场文书
2014年三八妇女节活动总结
2014/03/01 职场文书
聚会通知怎么写
2015/04/23 职场文书
元宵节晚会主持词
2015/07/01 职场文书
MySQL子查询中order by不生效问题的解决方法
2021/08/02 MySQL