JavaScript中的null和undefined解析


Posted in Javascript onApril 14, 2012

在JavaScript开发中,被人问到:null与undefined到底有啥区别?

一时间不好回答,特别是undefined,因为这涉及到undefined的实现原理。于是,细想之后,写下本文,请各位大侠拍砖。

总所周知:null == undefined

但是:null !== undefined

那么这两者到底有啥区别呢?

请听俺娓娓道来...

null

这是一个对象,但是为空。因为是对象,所以 typeof null 返回 'object' 。

null 是 JavaScript 保留关键字。

null 参与数值运算时其值会自动转换为 0 ,因此,下列表达式计算后会得到正确的数值:

表达式:123 + null 结果值:123

表达式:123 * null 结果值:0

undefined

undefined是全局对象(window)的一个特殊属性,其值是未定义的。但 typeof undefined 返回 'undefined' 。

虽然undefined是有特殊含义的,但它确实是一个属性,而且是全局对象(window)的属性。请看下面的代码:

alert('undefined' in window); //输出:true
alert(undefined in window); //输出:true
var anObj = {};
alert('undefined' in anObj); //输出:false

从中可以看出,undefined是window对象的一个属性,但却不是anObj对象的一个属性。

注意:尽管undefined是有特殊含义的属性,但却不是JavaScript的保留关键字。

undefined参与任何数值计算时,其结果一定是NaN。

随便说一下,NaN是全局对象(window)的另一个特殊属性,Infinity也是。这些特殊属性都不是JavaScript的保留关键字!

提高undefined性能

当我们在程序中使用undefined值时,实际上使用的是window对象的undefined属性。

同样,当我们定义一个变量但未赋予其初始值,例如:

var aValue;

这时,JavaScript在所谓的预编译时会将其初始值设置为对window.undefined属性的引用,

于是,当我们将一个变量或值与undefined比较时,实际上是与window对象的undefined属性比较。这个比较过程中,JavaScript会搜索window对象名叫‘undefined'的属性,然后再比较两个操作数的引用指针是否相同。

由于window对象的属性值是非常多的,在每一次与undefined的比较中,搜索window对象的undefined属性都会花费时间。在需要频繁与undefined进行比较的函数中,这可能会是一个性能问题点。因此,在这种情况下,我们可以自行定义一个局部的undefined变量,来加快对undefined的比较速度。例如:

function anyFunc()
{
var undefined; //自定义局部undefined变量

if(x == undefined) //作用域上的引用比较

while(y != undefined) //作用域上的引用比较

};

其中,定义undefined局部变量时,其初始值会是对window.undefined属性值的引用。新定义的局部undefined变量存在与该函数的作用域上。在随后的比较操作中,JavaScript代码的书写方式没有任何的改变,但比较速度却很快。因为作用域上的变量数量会远远少于window对象的属性,搜索变量的速度会极大提高。

这就是许多前端JS框架为什么常常要自己定义一个局部undefined变量的原因!

Javascript 相关文章推荐
网站上面有这种切换效果
Jun 26 Javascript
javascript判断iphone/android手机横竖屏模式的函数
Dec 20 Javascript
Jquery加载时从后台读取数据绑定到dropdownList实例
Jun 09 Javascript
JS中产生20位随机数以0-9为例也可以是a-z A-Z
Aug 01 Javascript
javascript实现汉字转拼音代码分享
Apr 20 Javascript
js贪吃蛇网页版游戏特效代码分享(挑战十关)
Aug 24 Javascript
在node中如何使用 ES6
Apr 22 Javascript
详解Angular路由 ng-route和ui-router的区别
May 22 Javascript
浅谈node模块与npm包管理工具
Jan 03 Javascript
使用webpack打包koa2 框架app
Feb 02 Javascript
如何在postman测试用例中实现断言过程解析
Jul 09 Javascript
VUE动态生成word的实现
Jul 26 Javascript
dtree 网页树状菜单及传递对象集合到js内,动态生成节点
Apr 14 #Javascript
jquerymobile checkbox及时刷新才能获取其准确值
Apr 14 #Javascript
深入理解JavaScript系列(16) 闭包(Closures)
Apr 12 #Javascript
深入理解JavaScript系列(15) 函数(Functions)
Apr 12 #Javascript
深入理解JavaScript系列(14) 作用域链介绍(Scope Chain)
Apr 12 #Javascript
jQuery UI Dialog 创建友好的弹出对话框实现代码
Apr 12 #Javascript
window.parent与window.openner区别介绍
Apr 12 #Javascript
You might like
咖啡是不是喝了会上瘾?咖啡是必须品吗!
2021/03/04 新手入门
thinkphp模板继承实例简述
2014/11/26 PHP
thinkphp常见路径用法分析
2014/12/02 PHP
php封装的smartyBC类完整实例
2016/10/19 PHP
JavaScript Eval 函数使用
2010/03/23 Javascript
stream.js 一个很小、完全独立的Javascript类库
2011/10/28 Javascript
jQuery点击自身以外地方关闭弹出层的简单实例
2013/12/24 Javascript
超详细的javascript数组方法汇总
2015/11/21 Javascript
JavaScript截取、切割字符串的技巧
2016/01/07 Javascript
jQuery+canvas实现简单的球体斜抛及颜色动态变换效果
2016/01/28 Javascript
一步步教大家编写酷炫的导航栏js+css实现
2016/03/14 Javascript
解决bootstrap中使用modal加载kindeditor时弹出层文本框不能输入的问题
2017/06/05 Javascript
使用vue构建一个上传图片表单
2017/07/04 Javascript
Javascript中的getter和setter初识
2017/08/17 Javascript
快速了解Node中的Stream流是什么
2019/02/13 Javascript
微信小程序实现张图片合成为一张并下载
2019/07/16 Javascript
layer.msg()去掉默认时间,实现手动关闭的方法
2019/09/12 Javascript
jquery 键盘事件 keypress() keydown() keyup()用法总结
2019/10/23 jQuery
有趣的JavaScript隐式类型转换操作实例分析
2020/05/02 Javascript
[00:35]TI7不朽珍藏III——寒冰飞龙不朽展示
2017/07/15 DOTA
Python2.x中文乱码问题解决方法
2015/06/02 Python
Python3控制路由器——使用requests重启极路由.py
2016/05/11 Python
python2.7读取文件夹下所有文件名称及内容的方法
2018/02/24 Python
pyqt实现.ui文件批量转换为对应.py文件脚本
2019/06/19 Python
python解析yaml文件过程详解
2019/08/30 Python
Django3.0 异步通信初体验(小结)
2019/12/04 Python
Python-jenkins模块之folder相关操作介绍
2020/05/12 Python
使用tensorflow实现VGG网络,训练mnist数据集方式
2020/05/26 Python
HTML5使用drawImage()方法绘制图像
2014/06/23 HTML / CSS
欧铁通票官方在线销售网站:Eurail.com
2017/10/14 全球购物
学生会招新策划书
2014/02/14 职场文书
期末评语大全
2014/05/04 职场文书
办理房产证委托书
2014/09/18 职场文书
2014年语文教学工作总结
2014/12/17 职场文书
Goland使用Go Modules创建/管理项目的操作
2021/05/06 Golang
JavaScript实现贪吃蛇游戏
2021/06/16 Javascript