av激情亚洲男人的天堂国语,日韩欧美精品一中文字幕,无码av一区二区三区无码,国产又色又爽又刺激的a片,国产又色又爽又刺激的a片

5年前，學(xué)習(xí)Null和Undefined，現(xiàn)在有了新的認(rèn)知，看看這位人才怎么說(shuō)？

許多編程語(yǔ)言都有一個(gè)稱(chēng)為null的非值。它指示一個(gè)變量當(dāng)前不指向一個(gè)對(duì)象，例如，當(dāng)它還沒(méi)有初始化的時(shí)候。

德城ssl適用于網(wǎng)站、小程序/APP、API接口等需要進(jìn)行數(shù)據(jù)傳輸應(yīng)用場(chǎng)景，ssl證書(shū)未來(lái)市場(chǎng)廣闊！成為成都創(chuàng)新互聯(lián)公司的ssl證書(shū)銷(xiāo)售渠道，可以享受市場(chǎng)價(jià)格4-6折優(yōu)惠！如果有意向歡迎電話聯(lián)系或者加微信：18980820575（備注：SSL證書(shū)合作）期待與您的合作！

相比之下，JavaScript有兩個(gè)這樣的非值：undefined和null。在這篇博文中，我們將研究它們有什么不同，以及如何最好地使用或避免它們。

1. undefined vs. null

這兩種值非常相似，經(jīng)?；Q使用。因此，它們的區(qū)別是微妙的。

1.1 ECMAScript語(yǔ)言規(guī)范:undefined vs. null

ECMAScript語(yǔ)言規(guī)范對(duì)其描述如下。

  • undefined是 "當(dāng)一個(gè)變量沒(méi)有被賦值時(shí)使用"
  • null "表示有意不存在任何對(duì)象值"

1.2 兩個(gè)非值--一個(gè)無(wú)法消除的錯(cuò)誤

在JavaScript中擁有兩個(gè)非值現(xiàn)在被認(rèn)為是一個(gè)設(shè)計(jì)錯(cuò)誤(甚至被JavaScript的創(chuàng)造者Brendan Eich認(rèn)為)。

那為什么不從 JavaScript 中刪除其中的一個(gè)值呢?JavaScript 的一個(gè)核心原則是絕不破壞向后兼容。這個(gè)原則有很多好處。它最大的缺點(diǎn)是，設(shè)計(jì)上的錯(cuò)誤無(wú)法被刪除。

1.3 undefined和null的歷史

在Java中(它啟發(fā)了JavaScript的許多方面)，初始化值取決于變量的靜態(tài)類(lèi)型。

  • 具有對(duì)象類(lèi)型的變量被初始化為null。
  • 每個(gè)原始類(lèi)型都有自己的初始化值。例如，int變量被初始化為0。

在JavaScript中，每個(gè)變量都可以容納對(duì)象值和基本類(lèi)型值。因此，如果null意味著 "不是一個(gè)對(duì)象"，那么JavaScript也需要一個(gè)初始化值，意味著 "既不是一個(gè)對(duì)象也不是一個(gè)原始值"。這個(gè)初始化值就是 undefined。

undefined 的出現(xiàn)

如果一個(gè)變量myVar還沒(méi)有被初始化，它的值是undefined。

 
 
 
 
    
  
  
  
  
  1. let myVar; 
    2. 
  
  
  
  
  2. assert.equal(myVar, undefined); 
    3.

如果一個(gè)屬性.unknownProp丟失，訪問(wèn)該屬性會(huì)產(chǎn)生undefined的值。

 
 
 
 
    
  
  
  
  
  1. const obj = {}; 
    2. 
  
  
  
  
  2. assert.equal(obj.unknownProp, undefined); 
    3.

如果一個(gè)函數(shù)有一個(gè)沒(méi)有參數(shù)的返回語(yǔ)句，該函數(shù)隱含地返回undefined。

 
 
 
 
    
  
  
  
  
  1. function myFunc() { 
    2. 
  
  
  
  
  2.   return; 
    3. 
  
  
  
  
  3. } 
    4. 
  
  
  
  
  4. assert.equal(myFunc(), undefined); 
    5.

如果一個(gè)參數(shù)x被省略了，語(yǔ)言將該參數(shù)初始化為undefined。

 
 
 
 
    
  
  
  
  
  1. function myFunc() { 
    2. 
  
  
  
  
  2.   return; 
    3. 
  
  
  
  
  3. } 
    4. 
  
  
  
  
  4. assert.equal(myFunc(), undefined); 
    5. 
  
  
  
  
  5. myFunc(); 
    6.

通過(guò)obj?.someProp的可選鏈路，如果obj未定義或?yàn)榭?，則返回未定義。

 
 
 
 
    
  
  
  
  
  1. > undefined?.someProp 
    2. 
  
  
  
  
  2. undefined 
    3. 
  
  
  
  
  3. > null?.someProp 
    4. 
  
  
  
  
  4. undefined 
    5.

3.null 出現(xiàn)情況

一個(gè)對(duì)象的原型要么是一個(gè)對(duì)象，要么在原型鏈的末端是null。Object.prototype沒(méi)有原型。

 
 
 
 
    
  
  
  
  
  1. > Object.getPrototypeOf(Object.prototype) 
    2. 
  
  
  
  
  2. null 
    3.

如果我們將一個(gè)正則表達(dá)式(如/a/)與一個(gè)字符串(如'x')相匹配，我們要么得到一個(gè)帶有匹配數(shù)據(jù)的對(duì)象(如果匹配成功)，要么得到空(如果匹配失敗)。

 
 
 
 
    
  
  
  
  
  1. > /a/.exec('x') 
    2. 
  
  
  
  
  2. null 
    3.

JSON數(shù)據(jù)格式不支持undefined，只支持null。

 
 
 
 
    
  
  
  
  
  1. > JSON.stringify({a: undefined, b: null}) 
    2. 
  
  
  
  
  2. '{"b":null}' 
    3.

4.特別處理 undefined 或 null 的運(yùn)算符

4.1 undefined 和參數(shù)默認(rèn)值

在以下情況下，將使用參數(shù)默認(rèn)值。

  • 缺少一個(gè)參數(shù)。
  • 一個(gè)參數(shù)的值是undefined。

例如：

 
 
 
 
    
  
  
  
  
  1. function myFunc(arg='abc') { 
    2. 
  
  
  
  
  2.   return arg; 
    3. 
  
  
  
  
  3. } 
    4. 
  
  
  
  
  4. assert.equal(myFunc('hello'), 'hello'); 
    5. 
  
  
  
  
  5. assert.equal(myFunc(), 'abc'); 
    6. 
  
  
  
  
  6. assert.equal(myFunc(undefined), 'abc'); 
    7.

undefined也觸發(fā)了參數(shù)的默認(rèn)值，這說(shuō)明它是一個(gè)元值。

下面的例子說(shuō)明了這一點(diǎn)的用處。

 
 
 
 
    
  
  
  
  
  1. function concat(str1='', str2='') { 
    2. 
  
  
  
  
  2.   return str1 + str2; 
    3. 
  
  
  
  
  3. } 
    4. 
  
  
  
  
  4. function twice(str) { // (A) 
    5. 
  
  
  
  
  5.   return concat(str, str); 
    6. 
  
  
  
  
  6. } 
    7.

在A行，我們沒(méi)有為str指定一個(gè)參數(shù)默認(rèn)值。當(dāng)這個(gè)參數(shù)缺失時(shí)，我們把這個(gè)狀態(tài)轉(zhuǎn)發(fā)給concat()，讓它選擇一個(gè)默認(rèn)值。

4.2 undefined 的和解構(gòu)的默認(rèn)值

解構(gòu)中的缺省值與參數(shù)缺省值的工作原理類(lèi)似--如果一個(gè)變量在數(shù)據(jù)中沒(méi)有匹配，或者它與undefined的變量匹配，就會(huì)使用它們。

 
 
 
 
    
  
  
  
  
  1. const [a='a'] = []; 
    2. 
  
  
  
  
  2. assert.equal(a, 'a'); 
    3. 
  
  
  
  
  3.  
    4. 
  
  
  
  
  4. const [b='b'] = [undefined]; 
    5. 
  
  
  
  
  5. assert.equal(b, 'b'); 
    6. 
  
  
  
  
  6.  
    7. 
  
  
  
  
  7. const {prop: c='c'} = {}; 
    8. 
  
  
  
  
  8. assert.equal(c, 'c'); 
    9. 
  
  
  
  
  9.  
    10. 
  
  
  
  
  10. const {prop: d='d'} = {prop: undefined}; 
    11. 
  
  
  
  
  11. assert.equal(d, 'd'); 
    12.

4.3 undefined 和 null 以及可選鏈

當(dāng)通過(guò) value?.prop 進(jìn)行可選的鏈接時(shí)

  • 如果value是undefined或null，則返回 undefined。也就是說(shuō)，只要value.prop會(huì)拋出一個(gè)異常，就會(huì)發(fā)生這種情況。
  • 否則，返回value.prop。
 
 
 
 
    
  
  
  
  
  1. function getProp(value) { 
    2. 
  
  
  
  
  2.   // optional static property access 
    3. 
  
  
  
  
  3.   return value?.prop; 
    4. 
  
  
  
  
  4. } 
    5. 
  
  
  
  
  5. assert.equal( 
    6. 
  
  
  
  
  6.   getProp({prop: 123}), 123); 
    7. 
  
  
  
  
  7. assert.equal( 
    8. 
  
  
  
  
  8.   getProp(undefined), undefined); 
    9. 
  
  
  
  
  9. assert.equal( 
    10. 
  
  
  
  
  10.   getProp(null), undefined); 
    11.

下面兩個(gè)操作的效果類(lèi)似。

 
 
 
 
    
  
  
  
  
  1. obj?.[?expr?] // optional dynamic property access 
    2. 
  
  
  
  
  2. func?.(?arg0?, ?arg1?) // optional function or method call 
    3.

4.4 undefined 和 null 和 nullish 聚結(jié)

nullish 合并算子??如果一個(gè)值undefined或?yàn)閚ull，則允許我們使用默認(rèn)值：

 
 
 
 
    
  
  
  
  
  1. > undefined ?? 'default value' 
    2. 
  
  
  
  
  2. 'default value' 
    3. 
  
  
  
  
  3. > null ?? 'default value' 
    4. 
  
  
  
  
  4. 'default value' 
    5. 
  
  
  
  
  5.  
    6. 
  
  
  
  
  6. > 0 ?? 'default value' 
    7. 
  
  
  
  
  7. 0 
    8. 
  
  
  
  
  8. > 123 ?? 'default value' 
    9. 
  
  
  
  
  9. 123 
    10. 
  
  
  
  
  10. > '' ?? 'default value' 
    11. 
  
  
  
  
  11. '' 
    12. 
  
  
  
  
  12. > 'abc' ?? 'default value' 
    13. 
  
  
  
  
  13. 'abc' 
    14.

null合并賦值操作符??=:

 
 
 
 
    
  
  
  
  
  1. function setName(obj) { 
    2. 
  
  
  
  
  2.   obj.name ??= '(Unnamed)'; 
    3. 
  
  
  
  
  3.   return obj; 
    4. 
  
  
  
  
  4. } 
    5. 
  
  
  
  
  5. assert.deepEqual( 
    6. 
  
  
  
  
  6.   setName({}), 
    7. 
  
  
  
  
  7.   {name: '(Unnamed)'} 
    8. 
  
  
  
  
  8. ); 
    9. 
  
  
  
  
  9. assert.deepEqual( 
    10. 
  
  
  
  
  10.   setName({name: undefined}), 
    11. 
  
  
  
  
  11.   {name: '(Unnamed)'} 
    12. 
  
  
  
  
  12. ); 
    13. 
  
  
  
  
  13. assert.deepEqual( 
    14. 
  
  
  
  
  14.   setName({name: null}), 
    15. 
  
  
  
  
  15.   {name: '(Unnamed)'} 
    16. 
  
  
  
  
  16. ); 
    17. 
  
  
  
  
  17. assert.deepEqual( 
    18. 
  
  
  
  
  18.   setName({name: 'Jane'}), 
    19. 
  
  
  
  
  19.   {name: 'Jane'} 
    20. 
  
  
  
  
  20. ); 
    21.

5. 處理 undefined 和 null

下面分享一下我們自己的代碼中處理undefined 和null的最常見(jiàn)方法。

5.1 undefined 或 null 都不能作為實(shí)際值使用

舉例，我們可能希望一個(gè)屬性file.title永遠(yuǎn)存在，并且永遠(yuǎn)是一個(gè)字符串。有兩種常見(jiàn)的方法來(lái)實(shí)現(xiàn)這一點(diǎn)。

這里，只檢查undefined和null，而不檢查一個(gè)值是否是字符串。你必須自己決定是否要把它作為一個(gè)額外的安全措施來(lái)實(shí)施。

5.1 undefined 和 null 都是禁止的

如下所示

 
 
 
 
    
  
  
  
  
  1. function createFile(title) { 
    2. 
  
  
  
  
  2.   if (title === undefined || title === null) { 
    3. 
  
  
  
  
  3.     throw new Error('`title` must not be nullish'); 
    4. 
  
  
  
  
  4.   } 
    5. 
  
  
  
  
  5.   // ··· 
    6. 
  
  
  
  
  6. } 
    7.

為什么選擇這種方法?

我們想把undefined和null當(dāng)作一樣的東西，因?yàn)镴avaScript代碼經(jīng)常這樣做--比如說(shuō)。

 
 
 
 
    
  
  
  
  
  1. // 檢測(cè)一個(gè)屬性是否存在 
    2. 
  
  
  
  
  2. if (!obj.requiredProp) { 
    3. 
  
  
  
  
  3.   obj.requiredProp = 123; 
    4. 
  
  
  
  
  4. } 
    5. 
  
  
  
  
  5.  
    6. 
  
  
  
  
  6. const myValue = myParameter ?? 'some default'; 
    7.

如果我們的代碼中出現(xiàn)了問(wèn)題，出現(xiàn)了undefined或null，我們希望它盡可能快地失敗。

5.1.2 undefined 和 null 都會(huì)觸發(fā)默認(rèn)值

如下所示

 
 
 
 
    
  
  
  
  
  1. function createFile(title) { 
    2. 
  
  
  
  
  2.   title ??= '(Untitled)'; 
    3. 
  
  
  
  
  3.   // ··· 
    4. 
  
  
  
  
  4. } 
    5.

我們不能在這里使用參數(shù)缺省值，因?yàn)樗挥蓇ndefined 觸發(fā)。相反，我們依靠nullish 合并賦值運(yùn)算符??=。

為什么選擇這種方法?

  • 我們想把undefined和null同等對(duì)待(見(jiàn)上一節(jié))。
  • 我們希望我們的代碼能夠穩(wěn)健地、無(wú)聲地處理 undefined 和null。

5.2 undefined 或 null 都是“關(guān)閉”值

例如，我們可能希望一個(gè)屬性file.title是一個(gè)字符串或 "關(guān)閉"(文件沒(méi)有標(biāo)題)。有幾種方法可以實(shí)現(xiàn)這一點(diǎn)。

5.2.1 null是 "關(guān)閉的 "值

 
 
 
 
    
  
  
  
  
  1. function createFile(title) { 
    2. 
  
  
  
  
  2.   if (title === undefined) { 
    3. 
  
  
  
  
  3.     throw new Error('`title` must not be undefined'); 
    4. 
  
  
  
  
  4.   } 
    5. 
  
  
  
  
  5.   return {title}; 
    6. 
  
  
  
  
  6. } 
    7.

另外，undefined可以觸發(fā)一個(gè)默認(rèn)值。

 
 
 
 
    
  
  
  
  
  1. function createFile(title = '(Untitled)') { 
    2. 
  
  
  
  
  2.   return {title}; 
    3. 
  
  
  
  
  3. } 
    4.

為什么選擇這種方法?

  • 我們需要一個(gè)表示“關(guān)閉”的非值。
  • 我們不希望我們的非值觸發(fā)參數(shù)默認(rèn)值和解構(gòu)默認(rèn)值。
  • 我們想把非值字符串化為JSON(這是我們不能用undefined做的)。

5.2.2 undefined 是"關(guān)閉的 "值。

 
 
 
 
    
  
  
  
  
  1. function createFile(title) { 
    2. 
  
  
  
  
  2.   if (title === null) { 
    3. 
  
  
  
  
  3.     throw new Error('`title` must not be null'); 
    4. 
  
  
  
  
  4.   } 
    5. 
  
  
  
  
  5.   return {title}; 
    6. 
  
  
  
  
  6. } 
    7.

為什么選擇這種方法?

  • 我們需要一個(gè)表示“關(guān)閉”的非值。
  • 我們確實(shí)想讓我們的非值觸發(fā)參數(shù)默認(rèn)值和解構(gòu)默認(rèn)值。

5.2.3 為什么不同時(shí)使用undefined和null作為 "關(guān)閉 "的值?

當(dāng)接收一個(gè)值時(shí)，把undefined和null都當(dāng)作 "不是一個(gè)值 "是有意義的。然而，當(dāng)我們創(chuàng)建值時(shí)，我們希望不含糊，以便處理這些值時(shí)保持簡(jiǎn)單。

這指向了一種不同的方法。如果我們需要一個(gè) "關(guān)閉"的值，但又不想使用undefined或null作為這樣的值，怎么辦?請(qǐng)往下看。

5.3 處理“關(guān)閉”的其他方式

5.3.1 特殊值

我們可以創(chuàng)建一個(gè)特殊的值，每當(dāng)屬性.title被關(guān)閉時(shí)，我們就使用這個(gè)值。

 
 
 
 
    
  
  
  
  
  1. const UNTITLED = Symbol('UNTITLED'); 
    2. 
  
  
  
  
  2. const file = { 
    3. 
  
  
  
  
  3.   title: UNTITLED, 
    4. 
  
  
  
  
  4. }; 
    5.

5.3.2 空對(duì)象模式

空對(duì)象模式來(lái)自于面向?qū)ο蟮木幊獭?/p>

  • 一個(gè)共同的超類(lèi)的所有子類(lèi)都有相同的接口。
  • 每個(gè)子類(lèi)都實(shí)現(xiàn)了一個(gè)實(shí)例運(yùn)行的不同模式。
  • 其中一個(gè)模式是 "null"。

在下面的例子中，UntitledFile實(shí)現(xiàn)了 "null" 模式。

 
 
 
 
    
  
  
  
  
  1. // 抽象的超類(lèi) 
    2. 
  
  
  
  
  2. class File { 
    3. 
  
  
  
  
  3.   constructor(content) { 
    4. 
  
  
  
  
  4.     if (new.target === File) { 
    5. 
  
  
  
  
  5.       throw new Error('Can’t instantiate this class'); 
    6. 
  
  
  
  
  6.     } 
    7. 
  
  
  
  
  7.     this.content = content; 
    8. 
  
  
  
  
  8.   } 
    9. 
  
  
  
  
  9. } 
    10. 
  
  
  
  
  10.  
    11. 
  
  
  
  
  11. class TitledFile extends File { 
    12. 
  
  
  
  
  12.   constructor(content, title) { 
    13. 
  
  
  
  
  13.     super(content); 
    14. 
  
  
  
  
  14.     this.title = title; 
    15. 
  
  
  
  
  15.   } 
    16. 
  
  
  
  
  16.   getTitle() { 
    17. 
  
  
  
  
  17.     return this.title; 
    18. 
  
  
  
  
  18.   } 
    19. 
  
  
  
  
  19. } 
    20. 
  
  
  
  
  20.  
    21. 
  
  
  
  
  21. class UntitledFile extends File { 
    22. 
  
  
  
  
  22.   constructor(content) { 
    23. 
  
  
  
  
  23.     super(content); 
    24. 
  
  
  
  
  24.   } 
    25. 
  
  
  
  
  25.   getTitle() { 
    26. 
  
  
  
  
  26.     return '(Untitled)'; 
    27. 
  
  
  
  
  27.   } 
    28. 
  
  
  
  
  28. } 
    29. 
  
  
  
  
  29.  
    30. 
  
  
  
  
  30. const files = [ 
    31. 
  
  
  
  
  31.   new TitledFile('Dear diary!', 'My Diary'), 
    32. 
  
  
  
  
  32.   new UntitledFile('Reminder: pick a title!'), 
    33. 
  
  
  
  
  33. ]; 
    34. 
  
  
  
  
  34.  
    35. 
  
  
  
  
  35. assert.deepEqual( 
    36. 
  
  
  
  
  36.   files.map(f => f.getTitle()), 
    37. 
  
  
  
  
  37.   [ 
    38. 
  
  
  
  
  38.     'My Diary', 
    39. 
  
  
  
  
  39.     '(Untitled)', 
    40. 
  
  
  
  
  40.   ]); 
    41.

我們也可以只對(duì)標(biāo)題使用空對(duì)象模式(而不是對(duì)整個(gè)文件對(duì)象)。

5.3.3 Maybe 類(lèi)型

Maybe 類(lèi)型是一種函數(shù)編程技術(shù)。

 
 
 
 
    
  
  
  
  
  1. function getTitle(file) { 
    2. 
  
  
  
  
  2.   switch (file.title.kind) { 
    3. 
  
  
  
  
  3.     case 'just': 
    4. 
  
  
  
  
  4.       return file.title.value; 
    5. 
  
  
  
  
  5.     case 'nothing': 
    6. 
  
  
  
  
  6.       return '(Untitled)'; 
    7. 
  
  
  
  
  7.     default: 
    8. 
  
  
  
  
  8.       throw new Error(); 
    9. 
  
  
  
  
  9.   } 
    10. 
  
  
  
  
  10. } 
    11. 
  
  
  
  
  11.  
    12. 
  
  
  
  
  12. const files = [ 
    13. 
  
  
  
  
  13.   { 
    14. 
  
  
  
  
  14.     title: {kind: 'just', value: 'My Diary'}, 
    15. 
  
  
  
  
  15.     content: 'Dear diary!', 
    16. 
  
  
  
  
  16.   }, 
    17. 
  
  
  
  
  17.   { 
    18. 
  
  
  
  
  18.     title: {kind: 'nothing'}, 
    19. 
  
  
  
  
  19.     content: 'Reminder: pick a title!', 
    20. 
  
  
  
  
  20.   }, 
    21. 
  
  
  
  
  21. ]; 
    22. 
  
  
  
  
  22.  
    23. 
  
  
  
  
  23. assert.deepEqual( 
    24. 
  
  
  
  
  24.   files.map(f => getTitle(f)), 
    25. 
  
  
  
  
  25.   [ 
    26. 
  
  
  
  
  26.     'My Diary', 
    27. 
  
  
  
  
  27.     '(Untitled)', 
    28. 
  
  
  
  
  28.   ]); 
    29.

我們可以通過(guò)Arrays對(duì) "just "和 "nothing "進(jìn)行編碼。我們的方法的好處是，它得到了TypeScript的良好支持(通過(guò)判別性聯(lián)合)。

6.我的方法

我不喜歡用undefined作為 "關(guān)閉 "的值，有三個(gè)原因。

  • undefined經(jīng)常意外地出現(xiàn)在JavaScript中。
  • ndefined會(huì)觸發(fā)參數(shù)和結(jié)構(gòu)化的默認(rèn)值(出于同樣的原因，有些人喜歡undefined)。

因此，如果我需要一個(gè)特殊的值，我會(huì)使用以下兩種方法中的一種。

  • 我使用null作為一個(gè) "關(guān)閉 "的值。(作為一個(gè)旁觀者，這種方法在TypeScript中得到了比較好的支持)。)
  • 我通過(guò)上述的技術(shù)之一來(lái)避免undefined和null。這樣做的好處是比較干凈，壞處是涉及更多的工作。

作者：Michael Thiessen

譯者：前端小智

來(lái)源：dev原文：https://2ality.com/2021/01/undefined-null-revisited.html


分享文章：5年前，學(xué)習(xí)Null和Undefined，現(xiàn)在有了新的認(rèn)知，看看這位人才怎么說(shuō)？
分享網(wǎng)址：http://uogjgqi.cn/article/coigesi.html
掃二維碼與項(xiàng)目經(jīng)理溝通

我們?cè)谖⑿派?4小時(shí)期待你的聲音

解答本文疑問(wèn)/技術(shù)咨詢(xún)/運(yùn)營(yíng)咨詢(xún)/技術(shù)建議/互聯(lián)網(wǎng)交流