Javascript基础教程之比较null和undefined值

更新时间：2016年05月16日 11:41:09 作者：Luka.Ye

这篇文章主要介绍了Javascript基础教程之比较null和undefined值的相关知识，非常不错，具有参考借鉴价值，感兴趣的朋友一起学习吧

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

以上内容是小编给大家介绍的js基础教程之比较null和undefined值的相关知识，希望对大家有所帮助！

您可能感兴趣的文章:

JavaScript遍历数组的三种方法map、forEach与filter实例详解
这篇文章主要介绍了JavaScript遍历数组的三种方法map、forEach与filter,结合实例形式详细分析了javascript针对数组遍历的map、forEach与filter三种方法相关操作技巧与注意事项,需要的朋友可以参考下
2019-02-02
js 发布订阅模式的实例讲解
下面小编就为大家带来一篇js 发布订阅模式的实例讲解。小编觉得挺不错的，现在就想给大家，也给大家做个参考。一起跟随小编过来看看吧
2017-09-09
TypeScript中的方法重载详解
这篇文章主要给大家介绍了关于TypeScript中方法重载的相关资料，文中通过示例代码介绍的非常详细，对大家学习或者使用TypeScript具有一定的参考学习价值，需要的朋友们下面来一起学习学习吧
2019-04-04
JavaScript必看的10道面试题总结（推荐）
JavaScript 已经成为全栈开发技能的基石，在全栈开发面试中都会不可避免地涉及到与 JavaScript 有关的问题。这篇文章主要给大家介绍了关于JavaScript必看的10道面试题,需要的朋友可以参考下
2021-05-05
取得传值的函数
取得传值的函数...
2006-10-10
彪哥1.1(智能表格)提供下载
彪哥1.1(智能表格)提供下载...
2006-09-09
Javascript的无new构建实例详解
这篇文章主要介绍了Javascript的无new构建实例详解的相关资料，小编感觉介绍的非常详细，具有参考借鉴价值，感兴趣的朋友一起学习吧
2016-05-05
纯css实现窗户玻璃雨滴逼真效果
css实现窗户上水珠效果，效果特别逼真，窗外的雨淅淅沥沥飘打在玻璃上，看起来很像模糊的窗外，斜滴的雨露，接下来给大家一起来用CSS技术实现这样一幅画面，下面给大家分享使用纯css实现窗户玻璃雨滴逼真效果，感兴趣的朋友快乐围观吧
2015-08-08
JS中正则表达式全局匹配模式 /g用法详解
本文章通过实例代码给大家详细介绍js中正则表达式的全局匹配模式 /g的用法，需要的朋友参考下
2017-04-04
JS实现可调整倒计时间代码分享
这篇文章主要介绍了JS实现可调整倒计时间代码，效果很酷炫，也很具有实用价值，感兴趣的小伙伴们可以参考一下
2015-08-08