真实的国产乱ⅩXXX66竹夫人,五月香六月婷婷激情综合,亚洲日本VA一区二区三区,亚洲精品一区二区三区麻豆

成都創(chuàng)新互聯網站制作重慶分公司

關于 JavaScript 中 null 的一切

原文地址:Everything about null in JavaScript

成都創(chuàng)新互聯10多年成都企業(yè)網站建設服務;為您提供網站建設,網站制作,網頁設計及高端網站定制服務,成都企業(yè)網站建設及推廣,對成都航空箱等多個方面擁有豐富的網站推廣經驗的網站建設公司。

原文作者:Dmitri Pavlutin

譯者:Gopal

JavaScript 有兩種類型:原始類型(strings, booleans, numbers, symbols)和對象

對象是一個復雜的數據結構。最簡單的 JavaScript 對象是普通對象 —— 鍵和相關值的集合

let myObject = {
  name: 'Eric Cartman'
};

但是很多情況下不能創(chuàng)建一個對象。在這種情況下,JavaScript 提供了一個特殊的值 null —— 表示缺少對象

let myObject = null;

在這篇文章中,你將學習關于 JavaScript 中的 null 的一切: 它的含義,如何檢測它,nullundefined 之間的區(qū)別,以及為什么大量使用 null 會造成代碼維護困難等

1.null 的概念

JavaScript 規(guī)范中這么描述 null

null 是一種原始類型,表示有意不包含任何對象值

如果您看到 null(分配給變量或由函數返回),那么在那個位置原本應該是一個對象,但由于某種原因,一個對象沒有創(chuàng)建

比如,函數 greetObject() 創(chuàng)建對象,但也可以在無法創(chuàng)建對象時返回 null:

function greetObject(who) {
  if (!who) {
    return null;
  }
  return { message: `Hello, ${who}!` };
}

greetObject('Eric'); // => { message: 'Hello, Eric!' }
greetObject();       // => null

當上面的函數中傳入一個字符串參數時,如預期的,函數返回一個對象 { message: 'Hello, Eric!' }

但是,函數中不傳任何參數時,該函數返回 null。返回 null 是合理的,因為 who 參數沒有值,導致 greeting 對象無法創(chuàng)建

1.1 null 的一個比較貼切的比喻

考慮關于 null 的一個比較貼切的比喻,你可以把變量想象成一個盒子。就像變量可以容納對象一樣,盒子也可以容納像茶壺等的物品

但一旦你收到一個盒子,打開它,什么也沒有!有人弄錯了,給了你一個空盒子。該盒子不包含任何內容,或者換句話說,它包含一個 null

2. 如何去檢測 null

檢查 null 好方法是使用嚴格相等運算符

const missingObject = null;
const existingObject = { message: 'Hello!' };

missingObject  === null; // => true
existingObject === null; // => false

missingObject === null 的結果為 true,因為 missingObject 變量包含一個 null 值。如果變量包含非空值,比如對象,則表達式 existingObject === null 的結果為 false

2.1 null 是一個假值

nullfalse、0、"、undefined、NaN 都是假值。如果在條件語句中遇到它們,那么 JavaScript 將把它們強制為 false

Boolean(null); // => false

if (null) {
  console.log('null is truthy');
} else {
  console.log('null is falsy'); // logs 'null is falsy'
}

2.2 typeof null

typeof value 類型操作符可以確定值的類型。例如,類型為 15 的是 number,typeof { prop: 'Value' } 等于 object。

有趣的是,null 值類型的結果是什么

typeof null; // => 'object'

一個缺失的對象類型怎么被判斷為 object? 原來 typoef null 作為 object 是早期 JavaScript 實現中的一個錯誤

不要使用 typeof 操作符檢測 null 值。如前所述,使用嚴格的相等運算符 myVar === null

如果你想使用 typeof 去檢查一個變量是否是一個對象,你必須排除掉 null 的情況

function isObject(object) {
  return typeof object === 'object' && object !== null;
}

isObject({ prop: 'Value' }); // => true
isObject(15);                // => false
isObject(null);              // => false

3. null 的陷阱

null 通常會在你希望使用對象的情況下意外出現。然后,如果嘗試從 null 中提取屬性,JavaScript 會拋出一個錯誤

讓我們再次使用 greetObject() 函數并嘗試從返回的對象中訪問 message 屬性

let who = '';

greetObject(who).message; 
// throws "TypeError: greetObject() is null"

因為 who 變量是一個空字符串,所以函數返回 null。當從 null 訪問 message 屬性時,將拋出類型錯誤錯誤

你可以通過使用 可選鏈操作符 來處理 null

let who = '';

greetObject(who)?.message ?? 'Hello, Stranger!';  
// => 'Hello, Stranger!'

或者使用下一節(jié)中描述的兩種選擇。

4. null 的替代方案

當你不能構造一個對象時,很容易返回 null。但這種做法也有缺點

一旦 null 出現在執(zhí)行堆棧中,你總是必須檢查它

我們盡量避免返回 null

  • 返回默認對象而不是 null
  • 拋出錯誤而不是返回 null

讓我們回憶一下 greetObject() 函數返回 greeting 對象

當缺少參數時,可以返回一個默認對象,而不是返回 null

function greetObject(who) {
  if (!who) {
    who = 'Stranger';
  }
  return { message: `Hello, ${who}!` };
}

greetObject('Eric'); // => { message: 'Hello, Eric!' }
greetObject();       // => { message: 'Hello, Stranger!' }

或者拋出一個錯誤

function greetObject(who) {
  if (!who) {
    throw new Error('"who" argument is missing');
  }
  return { message: `Hello, ${who}!` };
}

greetObject('Eric'); // => { message: 'Hello, Eric!' }
greetObject();       // => throws an error

這些實踐可以讓你完全避免處理 null

5. null vs undefined

undefined 就是未初始化的變量或對象屬性的值

例如,如果在聲明變量時沒有賦初值,那么訪問該變量的結果為 undefined

let myVariable;

myVariable; // => undefined

nullundefined 之間的主要區(qū)別是,null 表示丟失了的對象,而 undefined 表示未初始化的狀態(tài)

嚴格相等運算符 === 區(qū)分 nullundefined

null === undefined; // => false

而松散相等運算符 == 則認為 nullundefined 相等

null == undefined; // => true

我使用松散相等運算符檢查變量是否為 nullundefined

function isEmpty(value) {
  return value == null;
}

isEmpty(42);                // => false
isEmpty({ prop: 'Value' }); // => false
isEmpty(null);              // => true
isEmpty(undefined);         // => true

6. 總結

nullJavaScript 中的一個特殊值,表示丟失的對象

嚴格相等運算符判斷變量是否為空: variable === null。

typoef 操作符用于確定變量的類型(number, string, boolean)。但是,typeofnull 情況下會引起誤解: typeof null 結果為 object

nullundefined 在某種程度上是等價的,但null 表示一個丟失的對象,而 undefined 表示未初始化狀態(tài)

盡可能避免返回 null 或將變量設置為 null。因為這種做法會導致 null 值的擴展和需要對 null 的驗證。相反,嘗試使用具有默認屬性的對象,或者甚至拋出錯誤會是更好的實踐

你會使用什么方法來檢查 null?


網站名稱:關于 JavaScript 中 null 的一切
本文網址:http://weahome.cn/article/dsojgej.html

其他資訊

在線咨詢

微信咨詢

電話咨詢

028-86922220(工作日)

18980820575(7×24)

提交需求

返回頂部