JavaScript中undefined、null与NaN的区别

undefined、null与NaN的区别

1. 含义

undefined: 表示变量应该有值，但未赋值。其类型是undefined。

null: 表示定义了一个空对象 ( 内存地址指向为空 )。其类型是object。

NaN: 表示非数字 ( Not a number )。其类型是number。( Q: 既然表示非数字，为何其类型却是number？ )

2. typeof、==、===的区别

/** typeof */
typeof undefined;     // undefined
typeof null;          // object
typeof NaN;           // number
/** == */
undefined == null;   // true
undefined == NaN/** NaN跟NaN都不相等，跟其他值当然更不相等啦 **/;  // false
NaN == null;         // false
/** === */
undefined === null;  // false
undefined === NaN;   // false
NaN === null;        // false

3. JSON.stringify、toString的区别

const obj = { property1: undefined, property2: null, property3: NaN };
const arr = [ undefined, null, NaN ];
/** JSON */
console.log(JSON.stringify(obj));   // {"[property2":null,"[property3":null,}
console.log(JSON.stringify(arr));   // [null,null,null]
/** toString */
console.log(obj.toString());        // [object Object]
console.log(arr.toString());        // [,,NaN]

因JSON.stringify、Array.prototype.toString中的参数中有undefined、null、NaN时，结果可能非我们预期。故使用JSON.stringfy深拷贝对象或使用Array.prototype.toString扁平化数组时，应评估其结果的影响。

用于处理 null、NaN 和undefined 的 18 个 JavaScript 代码片段

Null、NaN 和 undefined 是程序员在使用 JavaScript 时遇到的常见值。

有效处理这些值对于确保代码的稳定性和可靠性至关重要。

因此，在今天这篇文章中，我们将探讨 18 个 JavaScript 代码片段，它们为处理 null、NaN 和未定义场景提供了便捷的解决方案。

这些代码片段将帮助你通过有效处理这些值来编写更清晰、更优雅的代码。

1. 检查是否为null：

要检查变量是否为 null，可以使用严格相等运算符 (===) 将其直接与 null 进行比较：

if (variable === null) {
  // Code to handle null value
}

2. 检查undefined：

同样，你可以使用 typeof 运算符检查变量是否为undefined：

if (typeof variable === 'undefined') {
  // Code to handle undefined value
}

3. 检查 NaN：

要检查值是否为 NaN（非数字），可以使用 isNaN() 函数：

if (isNaN(value)) {
  // Code to handle NaN value
}

4. 如果为 null 或undefined则默认为某个值：

如果变量为 null 或undefined，您可以使用逻辑 OR 运算符 (||) 提供默认值：

const result = variable || defaultValue;

5. 如果为 NaN，则默认为一个值：

如果值为 NaN，您可以使用 isNaN() 函数以及逻辑 OR 运算符来提供默认值：

const result = isNaN(value) ? defaultValue : value;

6. 将 null 或 undefined 转换为空字符串：

要将 null 或undefined的值转换为空字符串，可以使用逻辑 OR 运算符和空字符串：

const result = variable || '';

7. 将 null 或 undefined 转换为零：

如果需要将 null 或 undefined 转换为零，可以使用逻辑 OR 运算符和数字零：

const result = variable || 0;

8. 将 null 或 undefined 转换为默认对象：

要将 null 或 undefined 转换为默认对象，可以将逻辑 OR 运算符与空对象文字结合使用：

const result = variable || {};

9. 检查变量是否为 null 或undefined：

您可以使用逻辑 OR 运算符组合 null 和未定义检查：

if (variable === null || typeof variable === 'undefined') {
  // Code to handle null or undefined value
}

10. 检查值是否为 null、undefined或 NaN：

将 null、未定义和 NaN 检查与逻辑 OR 运算符结合起来：

if (variable === null || typeof variable === 'undefined' || isNaN(variable)) {
  // Code to handle null, undefined, or NaN value
}

11. unll或undefined的短路评估：

如果变量为 null 或undefined，请使用逻辑 AND 运算符 (&&) 执行短路计算：

const result = variable && someFunction();

12. 使用 NaN 进行短路评估：

如果值为 NaN，则可以使用逻辑 AND 运算符进行短路评估：

const result = !isNaN(value) && someFunction();

13. 可选链接：

为了避免在访问可能为 null 或未定义的对象的属性时出现错误，您可以使用可选链接运算符 (?.)：

const result = object?.property;

14. 空合并运算符：

空值合并运算符 (??) 提供了一种简洁的方法来为 null 或未定义的变量提供默认值：

const result = variable ?? defaultValue;

15. 将 null 或 undefined 转换为布尔值：

要将 null 或 undefined 转换为布尔值，可以使用逻辑 NOT 运算符 (!)：

const result = !!variable;

16. 将 NaN 转换为布尔值：

要将 NaN 转换为布尔值，可以使用 isNaN() 函数和逻辑 NOT 运算符：

const result = !isNaN(value);

17. 处理函数参数中的 null 或 undefined：

您可以使用默认参数值来处理函数参数中的 null 或undefined：

function myFunction(param = defaultValue) {
  // Code that uses the parameter
}

18. 从数组中删除 null 或undefined的值：

要从数组中删除 null 或undefined的值，可以使用 filter() 方法：

const newArray = originalArray.filter((value) => value !== null && typeof value !== 'undefined');

结论：

以上就是我今天与您分享的18 个 JavaScript 代码片段，希望这些代码片段对您有用，因为，这些代码片段可以帮助您有效地处理代码中的 null、NaN 和undefined的使用场景。

这些代码片段，无论您需要检查这些值、提供默认值还是将它们转换为不同的类型，它们都将帮助您编写更清晰、更优雅的 JavaScript 代码。

到此这篇关于 JavaScript中undefined、null与NaN的区别的文章就介绍到这了,更多相关 JavaScript undefined null NaN内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！