Javascript类型系统之undefined和null浅析


Posted in Javascript onJuly 13, 2016

前面的话

一般的程序语言,表示空的只有null,但javascript的设计者Brendan Eich却设计了一个undefined,这无疑增加了程序复杂度,但这样做也是有一定原因的。本文将详细介绍javascript中的undefined和null

历史原因

1995年JavaScript诞生时,最初像Java一样,只设置了null作为表示”无”的值。根据C语言的传统,null被设计成可以自动转为0

但是,JavaScript的设计者Brendan Eich,觉得这样做还不够,有两个原因。首先,null像在Java里一样,被当成一个对象。但是,JavaScript的值分成原始类型和对象类型两大类,Brendan Eich觉得表示”无”的值最好不是对象。其次,JavaScript的最初版本没有包括错误处理机制,发生数据类型不匹配时,往往是自动转换类型或者默默地失败。Brendan Eich觉得,如果null自动转为0,很不容易发现错误

因此,Brendan Eich又设计了一个undefined。他是这样区分的:null是一个表示”无”的对象,转为数值时为0;undefined是一个表示”无”的原始值,转为数值时为NaN

但是,目前null和undefined基本是同义的,都是原始类型,且只有一些细微的差别

undefined

Undefined类型只有一个值,就是undefined。当声明的变量未初始化时,该变量的默认值是undefined。所以一般地,undefined表示变量没有初始化

var test;//undefined
console.log(test == undefined);//true
var test = undefined;//undefined

对于尚未声明过的变量只能执行一项操作,使用typeof操作符检测其数据类型,但严格模式下会导致错误

typeof(test);//undefined

【出现场景】

【1】已声明未赋值的变量

【2】获取对象不存在的属性

【3】无返回值的函数的执行结果

【4】函数的参数没有传入

【5】void(expression)

var i;
console.log(i);//undefined
var o = {};
console.log(o.p);//undefined
function f(){};
console.log(f());//undefined
function f(x){return x;}
console.log(f());//undefined
console.log(void(0));//undefined

【类型转换】

Boolean(undefined):  false
Number(undefined):  NaN
String(undefined):'undefined'

null

Null类型只有一个值,就是null。null是javascript语言的关键字,它表示一个特殊值,常用来描述"空值"

逻辑角度看,null值表示一个空对象指针

[注意]null是空对象指针,而[]是空数组,{}是空对象,三者不相同

console.log(typeof null);//'object'

尽管null和undefined是不同的,但它们都表示"值的空缺",null表示"空值",undefined表示"未定义"。两者往往可以互换。判断相等运算符==认为两者是相等的

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

实际上,因为undefined和null不是构造器类型,所以它们没有任何的属性和方法,使用.和[]来存取这两个值的成员或方法都会产生一个类型错误

【类型转换】

Boolean(null): false
Number(null):
 0
String(null): 
 'null'

下面给大家介绍javascript中null和undefined的区别

undefined表示变量声明但未初始化时的值,null表示准备用来保存对象,还没有真正保存对象的值。从逻辑角度看,null值表示一个空对象指针。

JavaScript(ECMAScript标准)里共有5种基本类型:Undefined, Null, Boolean, Number, String,和一种复杂类型Object。可以看到null和undefined分属不同的类型,未初始化定义的值用typeof检测出来是"undefined"(字符串),而null值用typeof检测出来是"object"(字符串)。

任何时候都不建议显式的设置一个变量为undefined,但是如果保存对象的变量还没有真正保存对象,应该设置成null。
实际上,undefined值是派生自null值的,ECMAScript标准规定对二者进行相等性测试要返回true,即

alert(null==undefined); // true
Javascript 相关文章推荐
js中的escape及unescape函数的php实现代码
Sep 04 Javascript
Chrome扩展页面动态绑定JS事件提示错误
Feb 11 Javascript
JS将数字转换成三位逗号分隔的样式(示例代码)
Feb 19 Javascript
setTimeout()递归调用不加引号出错的解决方法
Sep 05 Javascript
Webwork 实现文件上传下载代码详解
Feb 02 Javascript
基于jquery编写分页插件
Mar 07 Javascript
全面解析bootstrap格子布局
May 22 Javascript
BootStrap 附加导航组件
Jul 22 Javascript
AngularJS实现按钮提示与点击变色效果
Sep 07 Javascript
javascript基础练习之翻转字符串与回文
Feb 20 Javascript
微信小程序实现跑马灯效果完整代码(附效果图)
May 30 Javascript
详解JavaScript 中的批处理和缓存
Nov 19 Javascript
JS基础随笔(菜鸟必看篇)
Jul 13 #Javascript
Bootstrap的Refresh Icon也spin起来
Jul 13 #Javascript
jQuery实现div横向拖拽排序的简单实例
Jul 13 #Javascript
用jQuery向div中添加Html文本内容的简单实现
Jul 13 #Javascript
使用jQuery加载html页面到指定的div实现方法
Jul 13 #Javascript
用原生JS对AJAX做简单封装的实例代码
Jul 13 #Javascript
javascript类型系统——undefined和null全面了解
Jul 13 #Javascript
You might like
php实现上传图片生成缩略图示例
2014/04/13 PHP
Phpstorm+Xdebug断点调试PHP的方法
2018/05/14 PHP
PHP文件后缀不强制为.php方法
2019/03/31 PHP
js获取提交的字符串的字节数
2009/02/09 Javascript
jquery1.4.2 for Visual studio 2010 模板文件
2010/07/14 Javascript
javascript 按键事件(兼容各浏览器)
2013/12/20 Javascript
jquery操作checked属性以及disabled属性的多种方法
2014/06/20 Javascript
javascript函数式编程程序员的工具集
2015/10/11 Javascript
jquery获取复选框checkbox的值的简单实现方法
2016/05/26 Javascript
关于Jquery中的bind(),on()绑定事件方式总结
2016/10/26 Javascript
DropDownList实现可输入可选择(两种版本可选)
2016/12/07 Javascript
setTimeout函数的神奇使用
2017/02/26 Javascript
详解vue.js的事件处理器v-on:click
2017/06/27 Javascript
AngularJS中下拉框的基本用法示例
2017/10/11 Javascript
js 取消页面可以选中文字的功能方法
2018/01/02 Javascript
mockjs+vue页面直接展示数据的方法
2018/12/19 Javascript
countup.js实现数字动态叠加效果
2019/10/17 Javascript
p5.js临摹动态图形实现方法详解
2019/10/23 Javascript
element-ui tooltip修改背景颜色和箭头颜色的实现
2019/12/16 Javascript
Jquery使用each函数实现遍历及数组处理
2020/07/14 jQuery
vue-quill-editor 自定义工具栏和自定义图片上传路径操作
2020/08/03 Javascript
如何正确解决VuePress本地访问出现资源报错404的问题
2020/12/03 Vue.js
[40:10]2015国际邀请赛全明星表演赛
2015/08/07 DOTA
[36:33]完美世界DOTA2联赛循环赛 Matador vs Forest 第一场 11.06
2020/11/06 DOTA
python抓取京东价格分析京东商品价格走势
2014/01/09 Python
python中多层嵌套列表的拆分方法
2018/07/02 Python
在Python中实现替换字符串中的子串的示例
2018/10/31 Python
关于Django ForeignKey 反向查询中filter和_set的效率对比详解
2018/12/15 Python
python随机模块random的22种函数(小结)
2020/05/15 Python
Python第三方库安装缓慢的解决方法
2021/02/06 Python
Hotels.com加拿大:领先的在线住宿网站
2018/10/05 全球购物
爱国演讲稿400字
2014/05/07 职场文书
全国税务系统先进集体事迹材料
2014/05/19 职场文书
经典祝酒词大全
2015/08/12 职场文书
springboot使用Redis作缓存使用入门教程
2021/07/25 Redis
Python OpenCV超详细讲解读取图像视频和网络摄像头
2022/04/02 Python