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 相关文章推荐
Javascript实现仿WebQQ界面的“浮云”兼容 IE7以上版本及FF
Apr 27 Javascript
js获取url参数代码实例分享(JS操作URL)
Dec 13 Javascript
jQuery检测鼠标左键和右键点击的方法
Mar 17 Javascript
js简单实现点击左右运动的方法
Apr 10 Javascript
JavaScript中使用自然对数ln的方法
Jun 14 Javascript
Jquery获取当前城市的天气信息
Aug 05 Javascript
BootStrap Validator 版本差异问题导致的submitHandler失效问题的解决方法
Dec 01 Javascript
Vue项目webpack打包部署到服务器的实例详解
Jul 17 Javascript
Vue0.1的过滤代码如何添加到Vue2.0直接使用
Aug 23 Javascript
JS中offset和匀速动画详解
Feb 06 Javascript
Angular 如何使用第三方库的方法
Apr 18 Javascript
通过GASP让vue实现动态效果实例代码详解
Nov 24 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定时任务获取微信access_token的方法
2016/10/10 PHP
PHP的微信支付接口使用方法讲解
2019/03/08 PHP
用javascript实现给出的盒子的序列是否可连为一矩型
2007/08/30 Javascript
jQuery实现的多选框多级联动插件
2014/05/02 Javascript
用原生JS获取CLASS对象(很简单实用)
2014/10/15 Javascript
基于jquery实现导航菜单高亮显示(两种方法)
2015/08/23 Javascript
angularjs封装bootstrap时间插件datetimepicker
2016/06/20 Javascript
AngularJS基础 ng-src 指令简单示例
2016/08/03 Javascript
利用node.js搭建简单web服务器的方法教程
2017/02/20 Javascript
vue中用动态组件实现选项卡切换效果
2017/03/25 Javascript
JS实现禁止用户使用Ctrl+鼠标滚轮缩放网页的方法
2017/04/28 Javascript
Vue 监听列表item渲染事件方法
2018/09/06 Javascript
模块化react-router配置方法详解
2019/06/03 Javascript
Vue实现数据表格合并列rowspan效果
2020/11/30 Javascript
浅入深出Vue之自动化路由
2019/08/06 Javascript
Vue.js实现大屏数字滚动翻转效果
2019/11/29 Javascript
JS使用Chrome浏览器实现调试线上代码
2020/07/23 Javascript
vuex 多模块时 模块内部的mutation和action的调用方式
2020/07/24 Javascript
webstorm建立vue-cli脚手架的傻瓜式教程
2020/09/22 Javascript
[57:41]Secret vs Serenity 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/17 DOTA
Python splitlines使用技巧
2008/09/06 Python
Python3.x和Python2.x的区别介绍
2013/02/12 Python
Python实现爬取逐浪小说的方法
2015/07/07 Python
Django中STATIC_ROOT和STATIC_URL及STATICFILES_DIRS浅析
2018/05/08 Python
python3解析库lxml的安装与基本使用
2018/06/27 Python
python二维列表一维列表的互相转换实例
2018/07/02 Python
Django后端接收嵌套Json数据及解析详解
2019/07/17 Python
韩国最大的购物网站:Gmarket
2019/06/20 全球购物
举例说明类变量和实例变量的区别
2016/06/30 面试题
企业项目策划书
2014/01/11 职场文书
联谊活动策划书
2014/01/26 职场文书
房地产开盘策划方案
2014/02/10 职场文书
项目投资建议书
2014/05/16 职场文书
相亲大会策划方案
2014/06/05 职场文书
PHP使用非对称加密算法RSA
2021/04/21 PHP
解决vue-router的beforeRouteUpdate不能触发
2022/04/14 Vue.js