javascript中undefined与null的区别

来详细讲解一下 JavaScript 中 undefined 与 null 的区别。

概述

JavaScript 中的 undefined 和 null 都是表示值的不存在或无效。它们两者很相似，但又有所不同。下面我们来逐个解释。

undefined

undefined 代表某个变量未被定义，或者存在但没有被赋值。在以下三种情况中，变量的值将默认为 undefined：

• 给未声明过的变量赋值时；
• 函数没有显式地返回值时；
• 对象中没有命名的属性。

下面是一些示例：

var x; // 声明但未被赋值
console.log(x); // undefined

function foo() {}
console.log(foo()); // undefined

var obj = { a: 1 };
console.log(obj.b); // undefined

null

与 undefined 不同，null 表示某个变量被定义了，但无值可用。在以下两种情况中，可以将变量值赋为 null：

• 用于清空变量中的引用数据类型（如对象、数组）的值；
• 等待服务器响应时，可以将变量值初始化为 null。

以下是一些示例：

var x = null; // 变量已被定义，但赋值为 null
console.log(x); // null

var obj = null;
obj = { a: 1 }; // 赋值为一个对象
console.log(obj); // { a: 1 }
obj = null; // 清空变量中的对象值
console.log(obj); // null

区别

总结一下，undefined：未定义、值为 undefined，通常是变量声明后未被赋值或者没有返回值；null：已定义但没有值可用，通常用于清空变量中的对象值或者变量初始化。

所以我们可以这样区分：未定义的变量其默认值为 undefined，已定义但未被赋值的变量也默认为 undefined；而 null 是一个已定义的空值。

示例：

var x;
console.log(x); // undefined

var y = null;
console.log(y); // null

示例

示例 1

下面的代码中，我们定义了一个对象，并且给它赋值为 null，之后再打印出来。但是这段代码会打印出 { a: null } 而不是 null。

var obj = { a: null };
console.log(obj.a); // null
console.log(obj.b); // undefined

原因是虽然在上面将变量 obj 赋值为 null，意味着这个变量并没有值可以使用了，但是它实际上已经被定义了。因此，打印出 obj 将仍然会得到一个对象，只是这个对象的属性 a 值为 null。

示例 2

我们在调用函数时，如果未传递预期的参数，则函数中的那个参数被定义为 undefined，而不是 null。

function foo(a, b) {
  console.log(a); // undefined
  console.log(b); // null
}

foo(undefined, null);

在以上例子中，我们将 foo 函数的第一个参数设置为 undefined，第二个参数设置为 null，所以第一个参数的值为 undefined，第二个参数的值为 null。