JavaScript 中有两个特数值： undefined和null，在比较它们的时候需要留心。在读取未赋值的变量或试图读取对象没有的属性时得到的就是 undefined 值。

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>Learn4UndefinedAndNull</title>
  6. </head>
  7. <body>
  8. <script>
  9.     var myData = {
  10.         name:"Luka",
  11.         weather:"sunny"
  12.     };
  13.     document.writeln("Prop: "+myData.doesntexits);
  14. </script>
  15. </body>
  16. </html>

输出结果：

  1.  Prop: undefined

Javascript 又定义了一个特殊值 null ，这个值与 undefined 略有不同。后者是在未定义值得情况下得到的值，而前者则用于表示已经赋了一个值但该值不是一个有效的 object、string、number 或 boolean 值（也就是说所定义的是一个无值[no value]）。

下面代码先后使用 undefined 和 null 以展示其不同效果：

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>Learn4UndefinedAndNull</title>
  6. </head>
  7. <body>
  8. <script>
  9.     var myData = {
  10.         name:"Luka"
  11.     };
  12.     //读取 weather 属性
  13.     document.writeln("Var: "+myData.weather+"<br />");
  14.     //判断对象是否具有 weather 这个属性
  15.     document.writeln("Prop: "+("weather" in myData)+"<br /><br />");
  16.  
  17.     myData.weather = "sunny";
  18.     document.writeln("Var: "+myData.weather+"<br />");
  19.     document.writeln("Prop: "+("weather" in myData)+"<br /><br />");
  20.  
  21.     myData.weather = null;
  22.     document.writeln("Var: "+myData.weather+"<br />");
  23.     document.writeln("Prop: "+("weather" in myData)+"<br /><br />");
  24. </script>
  25. </body>
  26. </html>

输出结果：

  1. Var: undefined
  2. Prop: false
  3.  
  4. Var: sunny
  5. Prop: true
  6.  
  7. Var: null
  8. Prop: true

1. 检查变量或属性是否为undefined 或 null

如果想检查某属性是否为 null 或 undefined(不管是哪一个)，那么只要使用 if 语句和逻辑非运算符(!)即可。

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>Learn4UndefinedAndNull</title>
  6. </head>
  7. <body>
  8. <script>
  9.     var myData = {
  10.         name:"Luka",
  11.         city:null
  12.     };
  13.  
  14.     if(!myData.name){
  15.         document.writeln("name is null or undefined <br /><br />");
  16.     }else {
  17.         document.writeln("name is not null or undefined <br /><br />")
  18.     }
  19.  
  20.     if(!myData.city){
  21.         document.writeln("city is null or undefined <br /><br />");
  22.     }else {
  23.         document.writeln("city is not null or undefined <br /><br />")
  24.     }
  25.  
  26.     if(!myData.weather){
  27.         document.writeln("weather is null or undefined <br /><br />");
  28.     }else {
  29.         document.writeln("weather is not null or undefined <br /><br />")
  30.     }
  31.  
  32. </script>
  33. </body>
  34. </html>

输出结果：

  1. name is not null or undefined
  2.  
  3. city is null or undefined
  4.  
  5. weather is null or undefined

2. 区分 null 和 undefined

在比较两个值时，所用办法应视需要而定。如果想同等对待 undefined值和null值，那么应该使用相等运算符(==)，让 Javascript 进行类型转换。此时值为 undefined 的变量会被认为与值为 null 的变量相等。如果要区分 null 和 undefined，则应使用等同运算符(===)。

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>Learn4UndefinedAndNull</title>
  6. </head>
  7. <body>
  8. <script>
  9.     var firstVal = null;
  10.     var secondVal;
  11.  
  12.     var equality = firstVal == secondVal;
  13.     var identity = firstVal === secondVal;
  14.  
  15.     document.writeln("Equality: "+equality+" <br />");
  16.     document.writeln("Identity: "+identity+" <br />");
  17. </script>
  18. </body>
  19. </html>

输出结果：

  1. Equality: true
  2. Identity: false

【Javascript 基础】比较 undefined 和 null 值的更多相关文章

  1. 【温故而知新-Javascript】比较 undefined 和 null 值

    JavaScript 中有两个特数值: undefined和null,在比较它们的时候需要留心.在读取未赋值的变量或试图读取对象没有的属性时得到的就是 undefined 值. <!DOCTYP ...

  2. JavaScript 中的undefined and null 学习

    JavaScript 中的undefined and null learn record from the definitive guide to html5 JavaScript 中有两个特殊值:u ...

  3. Javascript中的undefined、null、""、0值和false的区别总结

    在程序语言中定义的各种各样的数据类型中,我们都会为其定义一个"空值"或"假值",比如对象类型的空值null,.NET Framework中数据库字段的空值DBN ...

  4. JavaScript 基本类型值-Undefined、Null、Boolean

    ▓▓▓▓▓▓ 大致介绍 ECMAScript中有5中简单的数据类型(也称为基本数据类型):Undefined.Null.Boolean.Number.String. ▓▓▓▓▓▓ Undefined ...

  5. javascript中的undefined与null的区别

    一.相似性 在JavaScript中,将一个变量赋值为undefined或null,老实说,几乎没区别. var a = undefined; var a = null; 上面代码中,a变量分别被赋值 ...

  6. Javascript数据类型之Undefined和null

    Javascrip中的数据类型分为原始数据类型(primitive type)和对象数据类型(object type). 原始数据类型 原始数据类型包括:数字.字符串.布尔值.null.undefin ...

  7. [转]JS基础之undefined与null的区别

    在JavaScript开发中,被人问到:null与undefined到底有啥区别? 一时间不好回答,特别是undefined,因为这涉及到undefined的实现原理.于是,细想之后,写下本文,请各位 ...

  8. javascript中NAN undefined 和null

    null 表示无值,而 undefined 表示一个未声明的变量,或已声明但没有赋值的变量,或一个并不存在的对象属性. NaN 属性是代表非数字值的特殊值.该属性用于指示某个值不是数字.可以把 Num ...

  9. JavaScript中undefined与null的区别

    通常情况下, 当我们试图访问某个不存在的或者没有赋值的变量时,就会得到一个undefined值.Javascript会自动将声明是没有进行初始化的变量设为undifined. 如果一个变量根本不存在会 ...

随机推荐

  1. 用hibernate.properties代替hibernate.cfg.xml配置常用的属性

    我们使用hibernate时经常在hibernate.cfg.xml文件中配置数据库连接的相关属性,是否显示sql语句,数据库的方言等,这些配置其实也可以在.properties文件中配置.现在我把这 ...

  2. zepto方法

    1.$.inArray $.inArray v1.0+ $.inArray(element, array, [fromIndex]) ⇒ number 搜索数组中指定值并返回它的索引(如果没有找到则返 ...

  3. HDU 5245 Joyful(概率题求期望)

    D - Joyful Time Limit:1000MS     Memory Limit:65536KB     64bit IO Format:%I64d & %I64u Submit S ...

  4. YYH的积木（NOIP模拟赛Round 6）

    题目描述 YYH手上有n盒积木,每个积木有个重量.现在他想从每盒积木中拿一块积木,放在一起,这一堆积木的重量为每块积木的重量和.现在他想知道重量最少的k种取法的重量分别是多少. 输入输出格式 输入格式 ...

  5. 动态符号链接的细节 与 linux程序的加载过程

    转: http://hi.baidu.com/clivestudio/item/4341015363058d3d32e0a952 值得玩味的一篇分析程序链接.装载.动态链接细节的好文档 导读: by ...

  6. 无类型指针 在delphi中可以直接赋值任何指针类型。

  7. ros move_base costmap 理解和实现动态窗口法避障

    以下大部分内容参考自 ros_by_example_hydro_volume_1.pdf local costmap 是怎么生成的?跟三维点云有什么关系? global costmap在没有全局地图下 ...

  8. [thinkphp] APP_DEBUG开启之后session不稳定

    有时候在一个方法中写入了session, 在另一个方法中打印却什么都没有. 我这次的情况是网页上通过ajax传值到一个php函数,然后php把值写入session中.然后我在另一个php方法中打印se ...

  9. 陕西师范大学第七届程序设计竞赛网络同步赛 C iko和她的糖【贪心/ STL-优先队列/ 从1-N每个点有能量补充，每段有消耗，选三个点剩下最多能量】

    链接:https://www.nowcoder.com/acm/contest/121/C来源:牛客网 题目描述 iko超级超级喜欢吃糖,有一天iko想出去玩,她计划从1点走到N点(按1,2,3,.. ...

  10. springboot引入thymeleaf

    springboot引入thymeleaf 1.Thymeleaf使用 @ConfigurationProperties(prefix = "spring.thymeleaf") ...