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

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Learn4UndefinedAndNull</title>
</head>
<body>
<script>
var myData = {
name:"Luka",
weather:"sunny"
};
document.writeln("Prop: "+myData.doesntexits);
</script>
</body>
</html>

输出结果:

 Prop: undefined 

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

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

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Learn4UndefinedAndNull</title>
</head>
<body>
<script>
var myData = {
name:"Luka"
};
//读取 weather 属性
document.writeln("Var: "+myData.weather+"<br />");
//判断对象是否具有 weather 这个属性
document.writeln("Prop: "+("weather" in myData)+"<br /><br />"); myData.weather = "sunny";
document.writeln("Var: "+myData.weather+"<br />");
document.writeln("Prop: "+("weather" in myData)+"<br /><br />"); myData.weather = null;
document.writeln("Var: "+myData.weather+"<br />");
document.writeln("Prop: "+("weather" in myData)+"<br /><br />");
</script>
</body>
</html>

输出结果:

Var: undefined
Prop: false Var: sunny
Prop: true Var: null
Prop: true

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

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

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Learn4UndefinedAndNull</title>
</head>
<body>
<script>
var myData = {
name:"Luka",
city:null
}; if(!myData.name){
document.writeln("name is null or undefined <br /><br />");
}else {
document.writeln("name is not null or undefined <br /><br />")
} if(!myData.city){
document.writeln("city is null or undefined <br /><br />");
}else {
document.writeln("city is not null or undefined <br /><br />")
} if(!myData.weather){
document.writeln("weather is null or undefined <br /><br />");
}else {
document.writeln("weather is not null or undefined <br /><br />")
} </script>
</body>
</html>

输出结果:

name is not null or undefined

city is null or undefined

weather is null or undefined

2. 区分 null 和 undefined

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

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Learn4UndefinedAndNull</title>
</head>
<body>
<script>
var firstVal = null;
var secondVal; var equality = firstVal == secondVal;
var identity = firstVal === secondVal; document.writeln("Equality: "+equality+" <br />");
document.writeln("Identity: "+identity+" <br />");
</script>
</body>
</html>

输出结果:

Equality: true
Identity: false

【温故而知新-Javascript】比较 undefined 和 null 值的更多相关文章

  1. JavaScript中undefined与null的区别

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

  2. 【转】JavaScript中undefined与null的区别

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

  3. 【Javascript 基础】比较 undefined 和 null 值

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

  4. javascript类型系统——undefined和null

    × 目录 [1]原因 [2]undefined [3]null 前面的话 一般的程序语言,表示空的只有null,但javascript的设计者Brendan Eich却设计了一个undefined,这 ...

  5. Javascript数据类型——undefined和null的异同

    Javascript的基本数据类型中有undefined和null两种只有一个值得特殊数据类型.其中undefined表示未被初始化,不是为声明.而null表示一个空对象指针,而这也是使用typeof ...

  6. JavaScript的undefined与null、NaN的区别

    Javascript的数据类型 在JavaScript中,有三种住数据类型.两种复合数据类型和两种特殊数据类型. 1.主数据类型(基元数据类型) 字符串 String数据类型: 字符串值是一个由零个或 ...

  7. 【前端】javascript判断undefined、null、NaN;字符串包含等

    JS中判断null.undefined与NaN的方法 这篇文章主要介绍了JS中判断null.undefined与NaN的方法,需要的朋友可以参考下 . . 写了个 str ="s" ...

  8. javascript 数据类型 undefined 和null

    数据类型 undefind null boolean number string object type of 功能:检测变量类型 语法:type of 变量或 type of (变量) consol ...

  9. 快速弄清JavaScript中undefined和null的区别

    ES6的7大数据类型里面有这俩玩意:undefined和null,让接触不深的学习者常常产生混淆,这俩玩意的区别在哪呢? 字面意思上来看,undefined是未(被我们)阐明的,未说明的,null则意 ...

随机推荐

  1. csharp:Dapper Sample

    You can find Dapper on Google Code here: http://code.google.com/p/dapper-dot-net/ and the GitHub dis ...

  2. ReactNative——生命周期

    1.创建阶段 getDefaultProps:处理props的默认值 在react.createClass调用 //在创建类的时候被调用 this.props该组件的默认属性 2.实例化阶段 Reac ...

  3. C语言回滚(三)-指针

    #include <stdio.h>#include <stdlib.h> //& 地址运算符 //* 间接运算符 // *的作用 当*后面跟一个指针名或地址的时候, ...

  4. [转载]hashmap hashtable 的区别

    Hashtable 和 HashMap 做为 Map 的基本特性 两者都实现了Map接口,基本特性相同 -          对同一个Key,只会有一个对应的value值存在 -          如 ...

  5. 亲们! 首次见面! 带来不适!多多见谅!--------->>Bank系统

    亲们!您们好! 讲一下Bank系统的做法: 01.首先创建一个Card类 using System; using System.Collections.Generic; using System.Li ...

  6. 打印机问题win7 和xp

    服务器端问题,重启如下服务 net stop "print spooler" net start "print spooler" gpedit.msc 本地计算 ...

  7. galera cluster DDL节点间状态不一致的问题

    近期某个系统中的galera cluseter环境发生A DDL操作后,B节点未同步的情况,同时B节点的errorlog中有如下警告信息: 2016-07-23 17:31:32 18920 [War ...

  8. Play Framework介绍:控制器层

    业务逻辑代码通常位于模型(model)层.客户端(比如浏览器)无法直接调用其中的代码,所以模型对象提供的功能,必须作为资源以URI方式暴露给外部. 客户端使用HTTP协议来操作这些资源,从而调用了内部 ...

  9. H5实现的可自定义贪吃蛇游戏

    原创游戏,使用lufylegend.js开发 用canvas实现的贪吃蛇游戏,与一般的贪吃蛇游戏不同,图片经过美工设计,代码设计支持扩展和自定义. 游戏元素丰富,包括障碍物(仙人掌),金币(奖励),苹 ...

  10. 网站SEO之百度优化不得不知的铁人三项规则

    奥运会有铁人三项,此运动更好的协调了运动员的综合素质水平,而百度优化排名中的“铁人三项”规则则是让网站的整体质量更好的满足市场用户体验.针对不同部分的操作,可以让网站在每个细节处都能凸显以人为本的服务 ...