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 相关文章推荐
jquery入门——事件机制之事件中的冒泡现象示例解释
Sep 12 Javascript
js判断手机和pc端选择不同执行事件的方法
Jan 30 Javascript
JS控制表格实现一条光线流动分割行的方法
Mar 09 Javascript
JS获取复选框的值,并传递到后台的实现方法
May 30 Javascript
jQuery获取table行数并输出单元格内容的实现方法
Jun 30 Javascript
简单易懂的天气插件(代码分享)
Feb 04 Javascript
详解angularjs中的隔离作用域理解以及绑定策略
May 31 Javascript
Material(包括Material Icon)在Angular2中的使用详解
Feb 11 Javascript
深入理解ES6中let和闭包
Feb 22 Javascript
vue.js使用3DES加密的方法示例
May 18 Javascript
js实现浏览器打印功能的示例代码
Jul 15 Javascript
vue实践---根据不同环境,自动转换请求的url地址操作
Sep 21 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 字符截取 解决中文的截取问题,不用mb系列
2009/09/29 PHP
PHP正则的Unknown Modifier错误解决方法
2010/03/02 PHP
PHP网站安装程序制作的原理、步骤、注意事项和示例代码
2010/08/01 PHP
PHP屏蔽蜘蛛访问代码及常用搜索引擎的HTTP_USER_AGENT
2013/03/06 PHP
Zend Framework框架之Zend_Mail实现发送Email邮件验证功能及解决标题乱码的方法
2016/03/21 PHP
浅谈PHP的排列组合(如输入a,b,c 输出他们的全部组合)
2017/03/14 PHP
yii2实现Ueditor百度编辑器的示例代码
2018/11/02 PHP
javascript 写类方式之四
2009/07/05 Javascript
JQuery Tips(2) 关于$()包装集你不知道的
2009/12/14 Javascript
JavaScript的递归之递归与循环示例介绍
2013/08/05 Javascript
浅析Js中的单引号与双引号问题
2013/11/06 Javascript
jQuery 中国省市两级联动选择附图
2014/05/14 Javascript
javascript判断并获取注册表中可信任站点的方法
2015/06/01 Javascript
jQuery购物车插件jsorder用法(支持后台处理程序直接转换成DataTable处理)
2016/06/08 Javascript
详谈Ajax请求中的async:false/true的作用(ajax 在外部调用问题)
2017/02/10 Javascript
vue.js指令和组件详细介绍及实例
2017/04/06 Javascript
将input框中输入内容显示在相应的div中【三种方法可选】
2017/05/08 Javascript
浅谈通过JS拦截 pushState和replaceState事件
2017/07/21 Javascript
解决vue-cli单页面手机应用input点击手机端虚拟键盘弹出盖住input问题
2018/08/25 Javascript
javascript实现点亮灯泡特效示例
2019/10/15 Javascript
[55:11]完美世界DOTA2联赛PWL S2 SZ vs LBZS 第一场 11.26
2020/11/30 DOTA
python实现定时同步本机与北京时间的方法
2015/03/24 Python
Python扫描IP段查看指定端口是否开放的方法
2015/06/09 Python
Python实现读写INI配置文件的方法示例
2018/06/09 Python
Django用户认证系统 组与权限解析
2019/08/02 Python
Kears+Opencv实现简单人脸识别
2019/08/28 Python
如何使用python记录室友的抖音在线时间
2020/06/29 Python
详解canvas.toDataURL()报错的解决方案全都在这了
2020/03/31 HTML / CSS
巴西网上药店:Drogaria Araujo
2021/01/06 全球购物
Java的for语句中break, continue和return的区别
2013/12/19 面试题
请假条标准格式规范
2014/04/10 职场文书
2014年党员个人剖析材料
2014/10/08 职场文书
2014年文秘工作总结
2014/11/25 职场文书
美德少年事迹材料(2016推荐版)
2016/02/25 职场文书
spring cloud gateway中如何读取请求参数
2021/07/15 Java/Android
P站美图推荐——变身女主角特辑
2022/03/20 日漫