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 相关文章推荐
JavaScript 用cloneNode方法克隆节点的代码
Oct 15 Javascript
探讨在JQuery和Js中,如何让ajax执行完后再继续往下执行
Jul 09 Javascript
jQuery制作可自定义大小的拼图游戏
Mar 30 Javascript
原生javascript实现解析XML文档与字符串
Mar 01 Javascript
jQuery限制图片大小的方法
May 25 Javascript
深入理解JavaScript中的块级作用域、私有变量与模块模式
Oct 31 Javascript
自定义类似于jQuery UI Selectable 的Vue指令v-selectable
Aug 23 jQuery
原生JavaScript实现的简单放大镜效果示例
Feb 07 Javascript
详解自定义ajax支持跨域组件封装
Feb 08 Javascript
vue bus全局事件中心简单Demo详解
Feb 26 Javascript
ckeditor一键排版功能实现方法分析
Feb 06 Javascript
Vue项目中数据的深度监听或对象属性的监听实例
Jul 17 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
不用GD库生成当前时间的PNG格式图象的程序
2006/10/09 PHP
使用PHP批量生成随机用户名
2008/07/10 PHP
单一index.php实现PHP任意层级文件夹遍历(Zjmainstay原创)
2012/07/31 PHP
php用header函数实现301跳转代码实例
2013/11/25 PHP
PHPer 需要了解的 5 个 Composer 小技巧
2014/08/18 PHP
浅谈thinkphp的实例化模型
2015/01/04 PHP
用PHP生成excel文件到指定目录
2015/06/22 PHP
基于PHP实现用户注册登录功能
2016/10/14 PHP
详谈symfony window下的安装 安装时候出现的问题以及解决方法
2017/09/28 PHP
真正的JQuery.ajax传递中文参数的解决方法
2011/05/28 Javascript
javascript控制Div层透明属性由浅变深由深变浅逐渐显示
2013/11/12 Javascript
原生javaScript做得动态表格(注释写的很清楚)
2013/12/29 Javascript
简单的代码实现jquery定时器
2014/01/03 Javascript
基于原生JS实现图片裁剪
2016/08/01 Javascript
微信小程序分页加载的实例代码
2017/07/11 Javascript
React 使用browserHistory项目访问404问题解决
2018/06/01 Javascript
vue和webpack项目构建过程常用的npm命令详解
2018/06/15 Javascript
使用koa2创建web项目的方法步骤
2019/03/12 Javascript
[01:36:17]DOTA2-DPC中国联赛 正赛 Ehome vs iG BO3 第一场 1月31日
2021/03/11 DOTA
python发布模块的步骤分享
2014/02/21 Python
python定时器(Timer)用法简单实例
2015/06/04 Python
Python利用Nagios增加微信报警通知的功能
2016/02/18 Python
python安装oracle扩展及数据库连接方法
2017/02/21 Python
python/sympy求解矩阵方程的方法
2018/11/08 Python
python 不同方式读取文件速度不同的实例
2018/11/09 Python
Python自动化之数据驱动让你的脚本简洁10倍【推荐】
2019/06/04 Python
Python图像处理PIL各模块详细介绍(推荐)
2019/07/17 Python
python如何导出微信公众号文章方法详解
2020/08/31 Python
使用canvas实现黑客帝国数字雨效果
2020/01/02 HTML / CSS
圣诞节开幕词
2015/01/29 职场文书
班干部学习委员竞选稿
2015/11/20 职场文书
2016大学生社会实践单位评语
2015/12/01 职场文书
2016年党员公开承诺书范文
2016/03/24 职场文书
当你找不到方向的时候,不妨读读刘备的一生
2019/08/05 职场文书
python用字节处理文件实例讲解
2021/04/13 Python
html,css,javascript是怎样变成页面的
2023/05/07 HTML / CSS