第一文讓你徹底弄懂js中undefined和null的區(qū)別目錄前言一、基本概念1、undefined2、null二、簡(jiǎn)單區(qū)別三、表現(xiàn)形式1、typeof2、==與===3、Ototype.toString.call4、+運(yùn)算與Number()5、JSON.stringify6、letundefiend=test四、建議附：null在類(lèi)型判斷時(shí)為什么是object總結(jié)

前言

undefined和null的區(qū)別是個(gè)老生常談的話(huà)題了，之前我對(duì)二者的區(qū)別只是簡(jiǎn)單理解，例如二者轉(zhuǎn)成Boolean類(lèi)型都是false、使用==進(jìn)行比較時(shí)為true、使用===進(jìn)行比較時(shí)為false等，卻沒(méi)有真正系統(tǒng)地總結(jié)二者的區(qū)別。

某天，下班前幾分鐘，我徹底弄懂了undefined和null的區(qū)別。

一、基本概念

1、undefined

undefined是全局對(duì)象的一個(gè)屬性。也就是說(shuō)，它是全局作用域的一個(gè)變量（下面展開(kāi)對(duì)undefined變量的賦值操作）。undefined的最初值就是原始數(shù)據(jù)類(lèi)型undefined。

2、null

null是一個(gè)字面量，不像undefined，它不是全局對(duì)象的一個(gè)屬性。null是表示缺少的標(biāo)識(shí)，指示變量未指向任何對(duì)象。把null作為尚未創(chuàng)建的對(duì)象，或許更好理解。在API中，null常使用來(lái)表示返回類(lèi)型應(yīng)是一個(gè)對(duì)象，但沒(méi)有關(guān)聯(lián)某個(gè)具體對(duì)象的這么一個(gè)值。

二、簡(jiǎn)單區(qū)別

總的來(lái)說(shuō)，null和undefined都表示空，主要區(qū)別在于undefined表示尚未初始化的變量的值，而null表示該變量有意缺少對(duì)象指向。

undefined

這個(gè)變量從根本上就沒(méi)有定義。隱藏式空值。

null

這個(gè)值雖然定義了，但它并未指向任何內(nèi)存中的對(duì)象。聲明式空值。

以下是一張經(jīng)典的圖片，幫助我們理解。

三、表現(xiàn)形式

undefined和null在JavaScript中有什么不同的表現(xiàn)形式，理解這些表現(xiàn)形式，可以幫助我們更好地理解undefined和null的區(qū)別。

1、typeof

console.log(typeofundefined);//'undefined'

console.log(typeofnull);//'object'

typeofnull為object是一個(gè)歷史遺留問(wèn)題，直到現(xiàn)階段都無(wú)法被修復(fù)。

在JavaScript初始版本中，值以32位存儲(chǔ)。前3位表示數(shù)據(jù)類(lèi)型的標(biāo)記，其余位則表示值。

對(duì)于所有對(duì)象類(lèi)型，它的前3位都以000作為類(lèi)型標(biāo)記位。在JavaScript早期版本中，null被認(rèn)為是一個(gè)特殊的值，用來(lái)對(duì)應(yīng)C中的空指針，但JavaScript中沒(méi)有C中的指針概念，所以null意味著什么都沒(méi)有或者void并以全0（32位）表示。

因此每當(dāng)JavaScript讀取null時(shí)，它的前3位將它視為對(duì)象類(lèi)型，這也是為什么typeofnull返回object的原因。

2、==與===

console.log(null==undefined);//true

console.log(null===undefined);//false

console.log(!!null===!!undefined);//true

這一點(diǎn)相信大家都明白，==比較的是值，而===比較的是值跟類(lèi)型。undefined和null的布爾值都為false，因此在用==比較時(shí)，為true；而undefined和null的類(lèi)型不同，因此在用===比較時(shí)為false。

3、Ototype.toString.call

console.log(Ototype.toString.call(undefined));//'[objectUndefined]'

console.log(Ototype.toString.call(null));//'[objectNull]'

toString()是Object的原型方法，調(diào)用該方法，默認(rèn)返回當(dāng)前對(duì)象的[[Class]]。這是一個(gè)內(nèi)部屬性，其格式為[objectXxx]，其中Xxx就是對(duì)象的類(lèi)型。

那么既然在JavaScript中，萬(wàn)物皆對(duì)象，為什么xxx.toString()不能返回變量類(lèi)型？

這是因?yàn)楦鱾€(gè)類(lèi)中重寫(xiě)了toString()，因此需要調(diào)用Object中的toString()，且必須使用toString.call()的方式調(diào)用。對(duì)于Object對(duì)象，直接調(diào)用toString()就能返回[objectObject]；而對(duì)于其他對(duì)象，則需要通過(guò)call/apply來(lái)調(diào)用才能返回正確的類(lèi)型信息。

4、+運(yùn)算與Number()

leta=undefined+1;

letb=null+1;

console.log(a);//NaN

console.log(b);//1

console.log(Number(undefined));//NaN

console.log(Number(null));//0

這涉及到JavaScript中的隱式類(lèi)型轉(zhuǎn)換，在執(zhí)行加法運(yùn)算前，隱式類(lèi)型轉(zhuǎn)換會(huì)嘗試將表達(dá)式中的變量轉(zhuǎn)換為number類(lèi)型。如：1+1會(huì)得到結(jié)果11。

null轉(zhuǎn)化為number時(shí)，會(huì)轉(zhuǎn)換成0。

undefined轉(zhuǎn)換為number時(shí)，會(huì)轉(zhuǎn)換為NaN。

5、JSON.stringify

console.log(JSON.stringify({a:undefined}));//'{}'

console.log(JSON.stringify({b:null}));//'{b:null}'

console.log(JSON.stringify({a:undefined,b:null}));//'{b:null}'

JSON會(huì)將undefined對(duì)應(yīng)的key刪除，這是因?yàn)镴SON自身的轉(zhuǎn)換原則。在undefined的情況下，有無(wú)該條數(shù)據(jù)是沒(méi)有區(qū)別的，因?yàn)樗麄冊(cè)诒憩F(xiàn)形式上并無(wú)不同。

letobj1={a:undefined};

letobj2={};

console.log(obj1.a);//undefined

console.log(obj2.a);//undefined

6、letundefiend=test

functiontest(params){

letundefined='test';//該作用域內(nèi)undefined為一個(gè)變量，賦值為test

returnparams===undefined;

test();//false

test(undefined);//false

test('test');//ture

letundefined='test';//UncaughtSyntaxError:Identifier'undefined'hasalreadybeendeclared

JavaScript對(duì)于undefined的限制方式為全局創(chuàng)建了一個(gè)只讀的undefined，但是并沒(méi)有徹底禁止局部undefined變量的定義。

請(qǐng)?jiān)谌魏螘r(shí)候，都不要對(duì)undefined變量進(jìn)行覆蓋，就算是你的JSON轉(zhuǎn)換將undefined轉(zhuǎn)換為，也不要通過(guò)該操作進(jìn)行，這將是及其危險(xiǎn)的行為。

四、建議

如果你需要使用undefined定義空值，請(qǐng)不要采取以下兩種方式：

leta;leta=undefined;

進(jìn)而采取下面這種方式顯式聲明undefined：

leta=void0;

附：null在類(lèi)型判斷時(shí)為什么是object

這是一段歷史，1995年Javascript誕生之初，在實(shí)現(xiàn)js類(lèi)型判斷的方法時(shí)（也就是typeof），數(shù)值是以32位存儲(chǔ)的，由標(biāo)志位（1~3位）和數(shù)值組成。標(biāo)志位存儲(chǔ)的是低位的數(shù)據(jù)。這里有五種標(biāo)志位：

000表示對(duì)象1表示整數(shù)010表示浮點(diǎn)數(shù)100表示字符串110表示布爾類(lèi)