1.常规的解释,null是个对象,表示空值,undefined也是个对象,表示没有定义

2.详细分析

null

书上的解释(Javascript权威指南),Javascript的关键词null是一种特殊的值,它表示“无值”。null常常被看作对象类型的一个特殊值,即代表“无对象”的值。如果一个变量的值为null,那么你就会知道它的值不是有效的对象、数组、数字、字符串和布尔值。null对应类型object,布尔值false,数字0,字符串“null”

 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
var test = null;
 
//类型,输出object
document.write( typeof (test));
document.write("<br/>");
 
//字符串,输出nulltest
document.write(test + 'test');
document.write("<br/>");
 
//数字,输出10
document.write(test + 10);
document.write("<br/>");
 
//布尔值,输出false
if (test) {
   document.write("true");
}
if (!test) {
   document.write("false");
}

什么情况下会返回null

document.getElementById(‘XXX’); 寻找一个不存在的元素,返回null

undefined

undefined是window对象的一个属性,且不是关键词。书上解释,当你使用了一个并未声明的变量时,或者使用了已经声明但还没有赋值的变量时,又或者使用了一个并不存在的对象属性时,返回的就是这个值。undefined对应类型undefined,布尔型false,字符串undefined,数字计算结果一定是NaN

 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
var test;
 
//类型,输出undefined
document.write( typeof (test));
document.write("<br/>");
 
//字符串,输出undefinedtest
document.write(test + 'test');
document.write("<br/>");
 
//数字,输出NaN
document.write(test + 10);
document.write("<br/>");
 
//布尔值,输出false
if (test) {
   document.write("true");
}
if (!test) {
   document.write("false");
}

什么情况下会返回undefined,有人总结了如下几种场景

1.    直接访问没有修改的全局变量undefined,var x = undefined 那x的值为undefined

2.    使用没有声明的变量,在IE下出错,提示”xxx”未定义;已经声明,没有赋值,类似var x; alert(x);      弹出undefined

3.    使用了一个不存在的对象的属性

 
1
2
3
4
5
var coffee = {
   x:'1',
   y:2
}
alert(coffee.z);

上面有提到过undefined不是javascript的关键词,所以可以定义一个名字为undefined的变量,如下

 
1
2
3
4
5
var undefined = 10;
 
document.write( typeof (undefined));
document.write("<br/>")
document.write(undefined * 10);

在IE和搜狗浏览器下,返回结果    number             100

在firefox和chrome下,返回结果  undefined         NaN

所以最好不要使用undefined的变量名

使用undefined的一个场景

在某个场景中经常要用到undefined,最好定义一个变量类似

var x = undefined,可以提高性能。这是因为javascript引擎在使用undefined的时候都是遍历window对象,寻找undefined属性,遍历属性过程中会造成大量的时间。

null和undefined的比较

null == undefined 返回true

null===undefined  返回false

对 undefined 的优化

当我们在程序中使用 undefined 时,实际使用的是 window 对象的 undefined 属性,由于 window 对象的属性很多,在每一次与 undefined交时,搜索 window 对象的 undefined 属性都会花费时间。在需要经常使用 undefined 的场景中,可以定义一个局部的 undefined 变量。

例如:var undefined;

最后引用淘宝玉伯对null和undefined的解释

值类型的“虚无”用undefined,引用类型的“虚无”,用null。

了解undefined、null、NaN的区别的更多相关文章

  1. js判断undefined类型,undefined,null,NaN的区别

    js判断undefined类型 今天使用showModalDialog打开页面,返回值时.当打开的页面点击关闭按钮或直接点浏览器上的关闭则返回值是undefined   所以自作聪明判断       ...

  2. Javascript 中的非空判断 undefined,null, NaN的区别

    JS 数据类型 在介绍这三个之间的差别之前, 先来看一下JS  的数据类型. 在 Java ,C这样的语言中, 使用一个变量之前,需要先定义这个变量并指定它的数据类型,是整型,字符串型,.... 但是 ...

  3. (转载)Javascript 中的非空判断 undefined,null, NaN的区别

    原文地址:https://blog.csdn.net/oscar999/article/details/9353713 在介绍这三个之间的差别之前, 先来看一下JS  的数据类型. 在 Java ,C ...

  4. JavaScript 中undefined,null,NaN的区别

    1.类型分析: js中的数据类型有undefined,boolean,number,string,object等5种,前4种为原始类型,第5种为引用类型.var a1;var a2 = true;va ...

  5. js中undefined,null,NaN的区别

    1.类型分析: js中的数据类型有undefined,boolean,number,string,object等5种,前4种为原始类型,第5种为引用类型.var a1;var a2 = true;va ...

  6. null、undefined和NaN的区别

    未定义的值和定义未赋值的值是undefined: null是一种特殊的Object,可以给变量赋一个值null,来清除变量的值: NaN是一种特殊的number:

  7. undefined和NAN的区别(转)

    Javascript 中 null.NaN和undefined的区别 1.类型分析: js中的数据类型有undefined,boolean,number,string,object等5种,前4种为原始 ...

  8. js判断undefined类型,undefined,null, 的区别详细解析

    js判断undefined类型 今天使用showModalDialog打开页面,返回值时.当打开的页面点击关闭按钮或直接点浏览器上的关闭则返回值是undefined所以自作聪明判断 var reVal ...

  9. 【转】javascript中not defined、undefined、null以及NaN的区别

    原文链接(点击跳转) 第一:not defined 演示代码:   <span style="font-size:12px;"><span style=" ...

  10. 字符串怎么换行 || 字符串中使用单引号时应该怎么写 || 保留两位小数 || 数字0在if中的意思是false || 什么情况下会会报undefined || null和undefined的区别 ||

    换行的字符串 "This string\nhas two lines" 字符串中使用单引号时应该怎么写 'You\'re right, it can\'t be a quote' ...

随机推荐

  1. 前端js框架收藏

    1. AngularJS :AngularJS是为克服HTML在构建应用上的不足而设计的. 2. knockout 3. avalon :MVVM是前端究极的解决方案,因此之后我大多数时间都在折腾av ...

  2. RMAN catalog备份恢复方案

    对于数据库的稳定性,高可用,跨平台以及海量数据库的处理,Oracle 数据库通常是大型数据库和大企业的首选.尽管如此,仍然不乏很多中小企业想要品尝一下Oracle腥味,因此在Oracle环境中也有不少 ...

  3. EntityFramework版本下载和更新

    安装指定版本的Package(例如:EntityFramework 5.0): PM> Install-Package EntityFramework -ProjectName MusicSto ...

  4. java、myeclipse常见错误的解决(未完)

    1.报错java.lang.NoClassDefFoundError ,但是相关jar包已经导入工程. 解决方案:将jar包放入C盘tomcat上部署的相应项目中的WEB-INF/lib中.web容器 ...

  5. Mac,WIN下支撑 IPV6的 sftp客户端

    transmit 这样的话就可以使用 ipv6了,教育网的优势体现出来了,window下得 支撑 ipv6的sftp客户端 Bitvise SSH 和 WINSCP

  6. How To Set Up Nginx Server Blocks (Virtual Hosts) on Ubuntu

    sudo apt-get update sudo apt-get install nginxsudo mkdir -p /var/www/example.com/html sudo chown -R ...

  7. C#给文件重命名

    使用的主要方法是: File.Move(oldFileDir,newFileDir);//这个是移动文件的方法 Directory.GetFiles(dir);//获取dir路径下的所有文件的全路径 ...

  8. 发布代码小助手V2.1发布了——Code2HTML工具

    设计起源: 新浪博客似乎没有插入代码的功能,所以不得不用打空格的方法格式化代码.而且没法显示行号. 描述: 发布代码小助手用python和Tkinter开发,可以在任何常见操作系统上运行.主要用于在不 ...

  9. CSLA的项目结构(一)

    由于我也是边看边学,在很多概念不是很清晰的情况下,也不好将书中的大段内容全部摘抄过来,所以结合项目源码先分析再总结,就成目前比较可行方案,第一篇先从项目结构入手. 项目源码下载后,主要的功能集中在Co ...

  10. 问题:如何在固定大小的DIV层插入N多个图片

    这是贴友问的一个问题,具体需求是: 如何在固定大小的DIV层插入N多个图片,使其一行排列,超出层宽时出现滑动条? 原以为利用overflow属性可以实现,但是测试失败.后来利用div层叠实现了效果. ...