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 FormatNumber函数实现方法
Dec 30 Javascript
一个判断抢购时间是否到达的简单的js函数
Jun 23 Javascript
详谈JavaScript内存泄漏
Nov 14 Javascript
Javascript中的几种URL编码方法比较
Jan 23 Javascript
jQuery-1.9.1源码分析系列(十)事件系统之事件体系结构
Nov 19 Javascript
webpack配置的最佳实践分享
Apr 21 Javascript
vue3.0中的双向数据绑定方法及优缺点
Aug 01 Javascript
layui实现二维码弹窗、并下载到本地的方法
Sep 25 Javascript
微信小程序 scroll-view 实现锚点跳转功能
Dec 12 Javascript
JS如何寻找数组中心索引过程解析
Jun 01 Javascript
JS将指定的某个字符全部转换为其他字符实例代码
Oct 13 Javascript
vue3+typescript实现图片懒加载插件
Oct 26 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 HTML代码串 截取实现代码
2009/06/29 PHP
PHP+Oracle本地开发环境搭建方法详解
2019/04/01 PHP
jquery text()要注意啦
2009/10/30 Javascript
JQuery EasyUI 对话框的使用方法
2010/10/24 Javascript
jQuery语法总结和注意事项小结
2012/11/11 Javascript
js(jQuery)获取时间的方法及常用时间类搜集
2013/10/23 Javascript
javascript在myeclipse中报错的解决方法
2013/10/29 Javascript
同域jQuery(跨)iframe操作DOM(示例代码)
2013/12/13 Javascript
JS实现环形进度条(从0到100%)效果
2016/07/05 Javascript
vue v-on监听事件详解
2017/05/17 Javascript
基于Vue实例生命周期(全面解析)
2017/08/16 Javascript
详解tween.js 中文使用指南
2018/01/05 Javascript
理解Koa2中的async&await的用法
2018/02/05 Javascript
关于微信公众号开发无法支付的问题解决
2018/12/28 Javascript
mpvue小程序循环动画开启暂停的实现方法
2019/05/15 Javascript
Vue实现页面添加水印功能
2019/11/09 Javascript
vue等两个接口都返回结果再执行下一步的实例
2020/09/08 Javascript
[57:09]DOTA2-DPC中国联赛 正赛 Phoenix vs Dynasty BO3 第一场 1月26日
2021/03/11 DOTA
python单线程实现多个定时器示例
2014/03/30 Python
Python爬虫框架Scrapy安装使用步骤
2014/04/01 Python
Python学习笔记(一)(基础入门之环境搭建)
2014/06/05 Python
用Python进行TCP网络编程的教程
2015/04/29 Python
Python通过select实现异步IO的方法
2015/06/04 Python
Python通过正则表达式选取callback的方法
2015/07/18 Python
python与caffe改变通道顺序的方法
2018/08/04 Python
python文件操作之批量修改文件后缀名的方法
2018/08/10 Python
Python文件读写常见用法总结
2019/02/22 Python
使用python telnetlib批量备份交换机配置的方法
2019/07/25 Python
python 回溯法模板详解
2020/02/26 Python
python 动态绘制爱心的示例
2020/09/27 Python
纯CSS3实现扇形动画菜单(简化版)实例源码
2017/01/17 HTML / CSS
英国标志性奢侈品牌:Burberry
2016/07/28 全球购物
laravel使用redis队列实例讲解
2021/03/23 PHP
教师专业理论水平的自我评价分享
2013/11/09 职场文书
文明家庭先进事迹材
2014/01/27 职场文书
2014国庆节标语口号
2014/09/19 职场文书