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

简介:

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





本文转自叶超Luka博客园博客,原文链接:http://www.cnblogs.com/yc-755909659/p/5928023.html,如需转载请自行联系原作者
目录
相关文章
|
JavaScript 前端开发
JavaScript如何判断变量undefined
JavaScript如何判断变量undefined
|
机器学习/深度学习 JavaScript 前端开发
JavaScript typeof, null, 和 undefined
JavaScript typeof, null, 和 undefined
137 5
|
存储 JavaScript 前端开发
|
开发者 图形学 C#
揭秘游戏沉浸感的秘密武器:深度解析Unity中的音频设计技巧,从背景音乐到动态音效,全面提升你的游戏氛围艺术——附实战代码示例与应用场景指导
【8月更文挑战第31天】音频设计在游戏开发中至关重要,不仅能增强沉浸感,还能传递信息,构建氛围。Unity作为跨平台游戏引擎,提供了丰富的音频处理功能,助力开发者轻松实现复杂音效。本文将探讨如何利用Unity的音频设计提升游戏氛围,并通过具体示例代码展示实现过程。例如,在恐怖游戏中,阴森的背景音乐和突然的脚步声能增加紧张感;在休闲游戏中,轻快的旋律则让玩家感到愉悦。
622 0
|
JavaScript 前端开发 C++
【Azure Function】调试 VS Code Javascript Function本地不能运行,报错 Value cannot be null. (Parameter 'provider')问题
【Azure Function】调试 VS Code Javascript Function本地不能运行,报错 Value cannot be null. (Parameter 'provider')问题
124 0
|
前端开发 JavaScript 开发者
JavaScript中的哲学难题:深入探讨undefined与null的情感纠葛
【8月更文挑战第23天】在Web前端开发中,理解和区分`undefined`与`null`至关重要。`undefined`表示变量已声明但未赋值,常出现在未初始化的变量或函数无返回值的情形;`null`则是开发者主动赋值的结果,意味着变量虽存在但值为空。虽然`undefined == null`为真,但`undefined === null`为假,表明它们在语义上有明显差异。合理使用两者能增强代码的健壮性和可读性,避免运行时错误。
166 0
|
JavaScript 前端开发 数据库
编程小白到高手:掌握null与undefined、JavaScript中隐藏的技巧曝光!
编程小白到高手:掌握null与undefined、JavaScript中隐藏的技巧曝光!
TS,数据类型概述,常见的基本数据类型有number/string/boolean/undefined/null,字符串用““,let food: string = ‘糖葫芦‘,布尔类型
TS,数据类型概述,常见的基本数据类型有number/string/boolean/undefined/null,字符串用““,let food: string = ‘糖葫芦‘,布尔类型
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的客户关系管理系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的客户关系管理系统附带文章源码部署视频讲解等
245 2

热门文章

最新文章