你不知道的JavaScript--Item12 undefined 与 null

最新推荐文章于 2024-11-01 15:18:55 发布

原创最新推荐文章于 2024-11-01 15:18:55 发布 · 2.1k 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #对象 #null #undefined #区别和联系

Web前端同时被 3 个专栏收录

97 篇文章

订阅专栏

JavaScript

93 篇文章

订阅专栏

你不知道的JavaScript

37 篇文章

订阅专栏

本文深入探讨了JavaScript中null和undefined的区别与联系，包括它们的定义、产生原因、使用场景及性能影响。

当讨论JavaScript中的原始数据类型时，大多数人都知道从String、Number到Boolean的基本知识。这些原始类型相当简单，行为符合常识。但是，本文将更多关注独特的原始数据类型Null和Undefined，是什么让它们如此相似，却又似是而非。

一、理解null和undefined

在JavaScript中，null是字面量同时也是语言中的关键字，用来表示无法识别的对象值。换句话说，这用来表示“无值（no value）”，但你可以决定什么时候得到期望值。

虽然相似，undefined实际上代表了不存在的值（non-existence of a value），也即你有东西丢失了。两者都是完全不可变的，没有属性和方法，也不能给其属性赋值。事实上, 当你试图访问或定义null 与 undefined的一个属性将会引发一个类型错误（TypeError）。

没有值代表的布尔值是false，这意味着他们在条件上下文中会被被计算为false，如if语句。使用相等操作符(= =)比较这两个值和其他false值,他们并不等于除了自己：

null == 0; // false 
undefined == ""; // false 
null == false; // false 
undefined == false; // false 
null == undefined; // true

尽管如此，和其他相似之处，但null和undefined并不是等价的。每个作为其独特的类型的唯一成员,undefined是Undefined类型和null是Object类型。使用全等操作符（===）比较这两个值，这要求类型和值都相等，下面证明这一点：

null === undefined;  //false
typeof null; //"object"
typeof undefined;  //"undefined"

上面说明：null 这是一个对象，但是为空。而且 null 是 JavaScript 保留关键字。

另外null 参与数值运算时其值会自动转换为 0 ，因此，下列表达式计算后会得到正确的数值：

123 + null;　　　//123 
123 * null;　　　//0

undefined是全局对象（window）的一个特殊属性，其值是未定义的。但 typeof undefined 返回 ‘undefined’ 。
虽然undefined是有特殊含义的，但它确实是一个属性，而且是全局对象（window）的属性。请看下面的代码：

alert('undefined' in window);//输出：true 
var anObj = {}; 
alert('undefined' in anObj); //输出：false

从中可以看出，undefined是window对象的一个属性，但却不是anObj对象的一个属性。
注意：

尽管undefined是有特殊含义的属性，但却不是JavaScript的保留关键字。 undefined参与任何数值计算时，其结果一定是NaN。随便说一下，NaN是全局对象（window）的另一个特殊属性，Infinity也是。这些特殊属性都不是JavaScript的保留关键字！
验证一个值或者一个对象为null时，需要用“===” 来判定，若只用“==”,则无法判定是null 还是 undefined.

二、产生Undefined情况

有许多的方法产生一个undefined值的代码。它通常遇到当试图访问一个不存在的值时。在这种情况下，在JavaScript这种动态的弱类型语言中，只会默认返回一个undefined值，而不是上升为一个错误。

1、任何声明变量时没有提供一个初始值，都会有一个为undefined的默认值：

var foo; // 默认值为 undefined

2、当试图访问一个不存在的对象属性或数组项时，返回一个undefined值：

var array = [1, 2, 3]; 
var foo = array.foo; // foo 属性不存在, 返回 undefined 
var item = array[5]; // 数组中没有索引为5的项，返回 undefined

3、如果省略了函数的返回语句, 或者return语句未带任何参数返回undefined：

var value = (function(){

})(); // 返回 undefined 
var value1 = (function(){
    return;
})(); // 返回 undefined

4、调用函数时，应该提供的参数没有提供，该参数等于undefined

function f(x){
    console.log(x)
}
f(); // undefined

最后，undefined是一个预定义的全局变量(不像null关键字)初始化为undefined值：

'undefined' in window; // true

ECMAScript 5中，这个变量是只读的，以前并非如此。

三、null的用例

null的用例是使他与众不同的主要方面，因为不像undefined，null被认为是更有用。这正是为什么typeof操作符作用于null值时返回“object”。最初的理由是，现在仍然是，通常用作一个空引用一个空对象的预期,就像一个占位符。typeof的这种行为已经被确认为一个错误，虽然提出了修正，出于后兼容的目的，这一点已经保持不变。

一般来说,如果你需要给一个变量或属性指定一个不变值，将它传递给一个函数，或者从一个函数返回null，null几乎总是最好的选择。简而言之，JavaScript使用undefined并且程序员应该使用null。

null的另一个可行的用例，也被认为是良好的实践是一个显式指定变量为无效(object= null)当一个引用不再是必需的。通过分配null值，有效地清除引用，并假设对象没有引用其他代码，指定垃圾收集，确保回收内存。

四、提高undefined性能

当我们在程序中使用undefined值时，实际上使用的是window对象的undefined属性。同样，当我们定义一个变量但未赋予其初始值，例如：

var aValue;

这时，JavaScript在所谓的预编译时会将其初始值设置为对window.undefined属性的引用，于是，当我们将一个变量或值与undefined比较时，实际上是与window对象的undefined属性比较。这个比较过程中，JavaScript会搜索window对象名叫‘undefined’的属性，然后再比较两个操作数的引用指针是否相同。

由于window对象的属性值是非常多的，在每一次与undefined的比较中，搜索window对象的undefined属性都会花费时间。在需要频繁与undefined进行比较的函数中，这可能会是一个性能问题点。因此，在这种情况下，我们可以自行定义一个局部的undefined变量，来加快对undefined的比较速度。例如：

function anyFunc() { 
    var undefined; 
    //自定义局部undefined变量 
    if(x == undefined) 
    //作用域上的引用比较 
    while(y != undefined) 
    //作用域上的引用比较 
};

其中，定义undefined局部变量时，其初始值会是对window.undefined属性值的引用。新定义的局部undefined变量存在与该函数的作用域上。在随后的比较操作中，JavaScript代码的书写方式没有任何的改变，但比较速度却很快。因为作用域上的变量数量会远远少于window对象的属性，搜索变量的速度会极大提高。