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 相关文章推荐
Prototype使用指南之range.js
Jan 10 Javascript
js中匿名函数的N种写法
Sep 08 Javascript
javascript 函数参数限制说明
Nov 19 Javascript
JQuery与JS里submit()的区别示例介绍
Feb 17 Javascript
Jquery中offset()和position()的区别分析
Feb 05 Javascript
node.js require() 源码解读
Dec 13 Javascript
使用微信小程序开发前端【快速入门】
Dec 05 Javascript
AngularJS表单基本操作
Jan 09 Javascript
Angular 4依赖注入学习教程之InjectToken的使用(八)
Jun 04 Javascript
JavaScript中工厂函数与构造函数示例详解
May 06 Javascript
从0搭建vue-cli4脚手架
Jun 17 Javascript
详解JavaScript作用域、作用域链和闭包的用法
Sep 03 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创建桌面快捷方式的实例代码
2014/02/17 PHP
php网站被挂木马后的修复方法总结
2014/11/06 PHP
PHP的Yii框架中YiiBase入口类的扩展写法示例
2016/03/17 PHP
php计算多个集合的笛卡尔积实例详解
2017/02/16 PHP
safari下载文件自动加了html后缀问题
2018/11/09 PHP
Laravel 手动开关 Eloquent 修改器的操作方法
2019/12/30 PHP
在网页中控制wmplayer播放器
2006/07/01 Javascript
javascript 全角转换实现代码
2009/07/17 Javascript
基于jquery封装的一个js分页
2011/11/15 Javascript
推荐40个简单的 jQuery 导航插件和教程(下篇)
2012/09/14 Javascript
使用AngularJS和PHP的Laravel实现单页评论的方法
2015/06/19 Javascript
学习javascript面向对象 理解javascript原型和原型链
2016/01/04 Javascript
vue.js入门(3)——详解组件通信
2016/12/02 Javascript
layui radio性别单选框赋值方法
2018/08/15 Javascript
微信小程序 JS动态修改样式的实现方法
2018/12/16 Javascript
JS实现扫码枪扫描二维码功能
2020/01/03 Javascript
Python实现通过文件路径获取文件hash值的方法
2017/04/29 Python
基于Python的微信机器人开发 微信登录和获取好友列表实现解析
2019/08/21 Python
Win下PyInstaller 安装和使用教程
2019/12/25 Python
python高阶函数map()和reduce()实例解析
2020/03/16 Python
Python如何安装第三方模块
2020/05/28 Python
HTML5实现应用程序缓存(Application Cache)
2020/06/16 HTML / CSS
员工培训心得体会
2013/12/30 职场文书
项目总经理岗位职责
2014/02/14 职场文书
公休请假条
2014/04/11 职场文书
中学教师师德承诺书
2014/05/23 职场文书
公司授权委托书范文
2014/08/02 职场文书
邹越感恩父母演讲稿
2014/08/28 职场文书
综治工作心得体会
2014/09/11 职场文书
村党支部群众路线教育实践活动对照检查材料
2014/09/26 职场文书
演讲开场白台词大全
2015/05/29 职场文书
MATLAB 如何求取离散点的曲率最大值
2021/04/16 Python
python 常用的异步框架汇总整理
2021/06/18 Python
Python极值整数的边界探讨分析
2021/09/15 Python
Python+Tkinter制作专属图形化界面
2022/04/01 Python
python中Pyqt5使用Qlabel标签播放视频
2022/04/22 Python