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 相关文章推荐
你的编程语言可以这样做吗?
Sep 07 Javascript
用document.documentElement取代document.body的原因分析
Nov 12 Javascript
在服务端(Page.Write)调用自定义的JS方法详解
Aug 09 Javascript
JavaScript数组函数unshift、shift、pop、push使用实例
Aug 27 Javascript
javascript基于DOM实现权限选择实例分析
May 14 Javascript
JQuery学习总结【二】
Dec 01 Javascript
jQuery制作全屏宽度固定高度轮播图(实例讲解)
Jul 08 jQuery
微信小程序图片选择区域裁剪实现方法
Dec 02 Javascript
Vue2.0 http请求以及loading展示实例
Mar 06 Javascript
JavaScript实现淘宝京东6位数字支付密码效果
Aug 18 Javascript
jQuery实现侧边栏隐藏与显示的方法详解
Dec 22 jQuery
如何利用JavaScript实现二叉搜索树
Apr 02 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
PHP 已经成熟
2006/12/04 PHP
php简单日历函数
2015/10/28 PHP
详解PHP处理密码的几种方式
2016/11/30 PHP
PHP十六进制颜色随机生成器功能示例
2017/07/24 PHP
php+javascript实现的动态显示服务器运行程序进度条功能示例
2017/08/07 PHP
使用Zookeeper分布式部署PHP应用程序
2019/03/15 PHP
javascript 特性检测并非浏览器检测
2010/01/15 Javascript
jQuery中创建实例与原型继承揭秘
2011/12/21 Javascript
jquery实现兼容浏览器的图片上传本地预览功能
2013/10/14 Javascript
Js表格万条数据瞬间加载实现代码
2014/02/20 Javascript
jquery text()方法取标签中的文本
2014/07/25 Javascript
javascript实现动态加载CSS
2015/01/26 Javascript
javascript实现俄罗斯方块游戏的思路和方法
2015/04/27 Javascript
js实现的四级左侧网站分类菜单实例
2015/05/06 Javascript
JavaScript实现音乐自动切换和轮播
2017/11/05 Javascript
20个最常见的jQuery面试问题及答案
2018/05/23 jQuery
小程序分享模块超级详解(推荐)
2019/04/10 Javascript
Vue安装浏览器开发工具的步骤详解
2019/05/12 Javascript
Javascript如何递归遍历本地文件夹
2020/08/06 Javascript
解决Ant Design Modal内嵌Form表单initialValue值不动态更新问题
2020/10/29 Javascript
python实现决策树、随机森林的简单原理
2018/03/26 Python
Python 通配符删除文件的实例
2018/04/24 Python
python实现对求解最长回文子串的动态规划算法
2018/06/02 Python
Python List cmp()知识点总结
2019/02/18 Python
这可能是最好玩的python GUI入门实例(推荐)
2019/07/19 Python
pytorch ImageFolder的覆写实例
2020/02/20 Python
JPA的特点
2014/10/25 面试题
大学生自荐信
2013/12/11 职场文书
商业房地产广告语
2014/03/13 职场文书
保护环境倡议书范文
2014/05/13 职场文书
绿色环保口号
2014/06/12 职场文书
2015元旦主持词开场白和结束语
2014/12/14 职场文书
奖励通知
2015/04/22 职场文书
2015年度招聘工作总结
2015/05/28 职场文书
Android Studio实现带三角函数对数运算功能的高级计算器
2022/05/20 Java/Android
Nginx开源可视化配置工具NginxConfig使用教程
2022/06/21 Servers