JavaScript中的null和undefined区别介绍


Posted in Javascript onJanuary 01, 2015

JavaScript中存在2个代表信息不存在的特殊值:null和undefined。个人认为可以从以下角度来理解这两个特殊值之间的区别:

1.null代表有存储信息的容器(比如之前被赋过值的变量),但该容器中的内容为空。
2.undefined代表不存在用于存储信息的容器。

JavaScript中的null与其它多数编程语言中的null没有什么区别,基本用于表示信息值为空;而在JavaScript中下述情况下表达式返回结果为undefined:

1.从未被赋过值的变量。
2.访问某个对象不存在的属性值。
3.访问数组中不存在的成员。
4.调用没有return语句的函数。
5.调用return语句为空(“return ;”)的函数。

事实上,和Infinity、NaN一样,undefined在JavaScript中是一个全局变量,在ECMAScript 3中甚至可以被赋予其它值。ECMAScript 5纠正了这个错误,并将undefined变量设定为只读。

对于null和undefined之间的比较,可以使用===全等操作符。如果使用普通的==操作符,null与undefined是等价的:

console.log(null == undefined);//true

console.log(null === undefined);//false

在程序编写过程中,如果需要对某个变量赋以空值,一般使用null而不是undefined。其原因在于:

1.undefined一般认为是属于系统层面的、报错层面的信息缺失。
2.null一般认为是属于编程层面的、逻辑操作层面的信息值为空。

如果在程序中涉及类型转换,那么当转换为number类型时,null和undefined的结果是不一样的:

1.undefined转换为number的结果是NaN。
2.null转换为number的结果是0。

值得一提的是,空字符串和空数组转换成number后的结果也是0。

至于JavaScript中为什么要设计两个表示“没有”的值,可以参见阮一峰的博客文章。

实验

在下述实验代码中,表达式结果均为undefined:

var a;

console.log(a);
function Sample(x){

  this.x = x;

}

var s = new Sample();

console.log(s.x)

console.log(s.notExistVariable);
var n = [2,3,4];

console.log(n[8]);
function test(){

  //no return value for this function

}

console.log(test());
function test2(){

  return;

}

console.log(test2());
Javascript 相关文章推荐
js实现黑色简易的滑动门网页tab选项卡效果
Aug 31 Javascript
jQuery EasyUI常用数据验证汇总
Sep 18 Javascript
微信小程序 教程之wxapp 视图容器 view
Oct 19 Javascript
Vue2.0利用 v-model 实现组件props双向绑定的优美解决方案
Mar 13 Javascript
JS中‘hello’与new String(‘hello’)引出的问题详解
Aug 14 Javascript
详解vue-router数据加载与缓存使用总结
Oct 29 Javascript
Vue.js实现可排序的表格组件功能示例
Feb 19 Javascript
JavaScript偏函数与柯里化实例详解
Mar 27 Javascript
electron实现静默打印的示例代码
Aug 12 Javascript
echarts饼图各个板块之间的空隙如何实现
Dec 01 Javascript
JS前端canvas交互实现拖拽旋转及缩放示例
Aug 05 Javascript
vue el-table实现递归嵌套的示例代码
Aug 14 Vue.js
JavaScript中的全局对象介绍
Jan 01 #Javascript
原生javascript获取元素样式
Dec 31 #Javascript
JavaScript分析、压缩工具JavaScript Analyser
Dec 31 #Javascript
jQuery中:last-child选择器用法实例
Dec 31 #Javascript
jQuery中:nth-child选择器用法实例
Dec 31 #Javascript
jQuery中:first-child选择器用法实例
Dec 31 #Javascript
jQuery中复合属性选择器用法实例
Dec 31 #Javascript
You might like
利用ThinkPHP内置的ThinkAjax实现异步传输技术的实现方法
2011/12/19 PHP
PHP图片等比例缩放生成缩略图函数分享
2014/06/10 PHP
php使用ob_start()实现图片存入变量的方法
2014/11/14 PHP
根据key删除数组中指定的元素实现方法
2017/03/02 PHP
PHP检查网站是否宕机的方法示例
2017/07/24 PHP
JS控制表格隔行变色
2006/06/26 Javascript
从javascript语言本身谈项目实战
2006/12/27 Javascript
jQuery 表单验证扩展(四)
2010/10/20 Javascript
jQuery hover 延时器实现代码
2011/03/12 Javascript
弹出层之1:JQuery.Boxy (一) 使用介绍
2011/10/06 Javascript
裁剪字符串trim()自定义改进版
2013/04/10 Javascript
基于jquery实现控制经纬度显示地图与卫星
2013/05/20 Javascript
js修改input的type属性问题探讨
2013/10/12 Javascript
浏览器环境下JavaScript脚本加载与执行探析之动态脚本与Ajax脚本注入
2016/01/19 Javascript
由简入繁实现Jquery树状结构的方法(推荐)
2016/06/10 Javascript
jQuery select自动选中功能实现方法分析
2016/11/28 Javascript
react路由配置方式详解
2017/08/07 Javascript
javascript 日期相减-在线教程(附代码)
2017/08/17 Javascript
node和vue实现商城用户地址模块
2018/12/05 Javascript
vue路由对不同界面进行传参及跳转的总结
2019/04/20 Javascript
Vue插件之滑动验证码用法详解
2020/04/05 Javascript
深入浅析ImageMagick命令执行漏洞
2016/10/11 Python
对python中数组的del,remove,pop区别详解
2018/11/07 Python
详解分布式任务队列Celery使用说明
2018/11/29 Python
python assert的用处示例详解
2019/04/01 Python
python 实现GUI(图形用户界面)编程详解
2019/07/17 Python
利用python在excel中画图的实现方法
2020/03/17 Python
Python魔术方法专题
2020/06/19 Python
Css3新特性应用之形状总结
2016/12/08 HTML / CSS
企业员工培训感言
2014/02/26 职场文书
校运动会广播稿300字
2014/10/07 职场文书
2015年度培训工作总结范文
2015/04/02 职场文书
运动会班级前导词
2015/07/20 职场文书
Go语言中break label与goto label的区别
2021/04/28 Golang
总结Pyinstaller打包的高级用法
2021/06/28 Python
Appium中scroll和drag_and_drop根据元素位置滑动
2022/02/15 Python