JavaScript中擂煞,var混弥、let和const的區(qū)別

ES6建議不再使用var定義變量,而使用let定義變量颈娜,const定義常量剑逃。

無論是let還是const,它們均解決了JS中長久以來的變量定義的問題浙宜。

咱們先聊聊varlet的區(qū)別。

一蛹磺、變量具有塊級作用域粟瞬,在代碼塊之外不可使用

使用var定義變量時,無論其實際聲明位置在何處萤捆,都會被視為聲明于所在函數(shù)的頂部 (如果聲明不在任意函數(shù)內裙品,則視為在全局作用域的頂部),使用if或者for等循環(huán)定義的變量俗或,變量同樣會被提升到if或for所在的函數(shù)頂部市怎。

var關鍵字在if中定義變量

使用let定義變量時,該變量只能在當前塊級作用域里使用辛慰,在外部訪問會顯示未定義

塊級作用域(又被稱為詞法作用域)會在以下兩種情況被創(chuàng)建:

  1. 在一個函數(shù)內部
  2. 在一個代碼塊(由一對花括號包裹,比如if区匠、for、switch帅腌、while)內部
let關鍵字在if中定義變量

接下來我們看看在循環(huán)中使用的情況

如果我們在for循環(huán)中用var定義變量驰弄,在延遲后輸出i,可以看到全部輸出的都是3速客,這是由于i變量的定義被提升出去了戚篙,左邊的代碼等價于右邊的代碼

var關鍵字在for中定義變量

而在過去我們要解決這個問題只能通過 IIFE 來強制改變作用域去解決這個問題

通過IIFE解決循環(huán)中的變量問題

如果在for循環(huán)中使用let定義變量,變量所在的作用域是在循環(huán)體這個代碼塊內溺职,因此在循環(huán)外就不能使用了岔擂。另外,for循環(huán)會對該變量做特殊處理浪耘,讓每次循環(huán)使用的都是一個獨立的循環(huán)變量乱灵。

let關鍵字在for中定義變量

二、變量的提升問題

var定義的變量先賦值再聲明是沒有任何問題的七冲,因為里面會有變量提升的情況阔蛉。

而用let定義的變量不會被提升,這里有個暫時性死區(qū)的概念

暫時性死區(qū)

使用 letconst 聲明的變量癞埠,在到達聲明處之前都是無法訪問的,會被放置在JS社區(qū)稱為暫時性死區(qū)( temporal dead zone ,TDZ )的區(qū)域內聋呢,試圖訪問會導致一個引用錯誤苗踪。

雖然該名稱并未在 ECMAScript 規(guī)范中被明確命名,但經(jīng)常被用于描述 letconst 聲明的變量為何在聲明處之前無法被訪問削锰。

下面放一個先賦值再聲明會直接報 Cannot access 'a' before initialization 的錯誤的例子

三通铲、全局定義的變量不再作為屬性添加到全局對象中

在全局使用var定義的變量會被掛載到全局也就是window對象中

而使用let定義的變量并不會被掛載到全局對象中

四、不可重復定義同名變量

var在重復定義同名變量的時候并不會報錯器贩,最終打印會是最后一個所賦的值

let重復定義同名變量會直接報 Identifier 'a' has already been declared 的錯誤


下面來聊聊const的使用

  1. constlet同樣具有塊級作用域颅夺,且聲明不會被提升的特點朋截。
  2. 使用const定義變量時,必須初始化

在過去只有var一個關鍵字吧黄,沒有辦法清晰的表明這個變量是否需要修改部服,而新增了letconst關鍵字后,可以使用let來聲明可以被修改的變量拗慨,使用const來聲明不會被修改的變量廓八,而使用const聲明的變量會被認為是常量( constant ),這樣語義上會更加清晰赵抢。

如果我們嘗試修改const定義的變量剧蹂,會報Assignment to constant variable錯誤。

由于不可以被更改的特性烦却,那么我們用const定義變量的時候就必須初始化宠叼,不然會報Missing initializer in const declaration的錯誤,而使用varlet的話其爵,可以先聲明后面需要的時候再賦值冒冬。


這對與開發(fā)有什么影響呢?

其實這里對我們的開發(fā)并沒有什么影響醋闭,在后續(xù)的開發(fā)中我們均使用const來定義變量即可窄驹,當發(fā)現(xiàn)有變量需要修改的時候,再改為let证逻。
但我們還是得了解letvar的區(qū)別是什么乐埠,畢竟面試題就愛考這些。
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
  • 序言:七十年代末囚企,一起剝皮案震驚了整個濱河市丈咐,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌龙宏,老刑警劉巖棵逊,帶你破解...
    沈念sama閱讀 219,188評論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異银酗,居然都是意外死亡辆影,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,464評論 3 395
  • 文/潘曉璐 我一進店門黍特,熙熙樓的掌柜王于貴愁眉苦臉地迎上來蛙讥,“玉大人,你說我怎么就攤上這事灭衷〈温” “怎么了?”我有些...
    開封第一講書人閱讀 165,562評論 0 356
  • 文/不壞的土叔 我叫張陵,是天一觀的道長迫像。 經(jīng)常有香客問我劈愚,道長,這世上最難降的妖魔是什么闻妓? 我笑而不...
    開封第一講書人閱讀 58,893評論 1 295
  • 正文 為了忘掉前任菌羽,我火速辦了婚禮,結果婚禮上纷闺,老公的妹妹穿的比我還像新娘算凿。我一直安慰自己,他們只是感情好犁功,可當我...
    茶點故事閱讀 67,917評論 6 392
  • 文/花漫 我一把揭開白布氓轰。 她就那樣靜靜地躺著,像睡著了一般浸卦。 火紅的嫁衣襯著肌膚如雪署鸡。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,708評論 1 305
  • 那天限嫌,我揣著相機與錄音靴庆,去河邊找鬼。 笑死怒医,一個胖子當著我的面吹牛炉抒,可吹牛的內容都是我干的。 我是一名探鬼主播稚叹,決...
    沈念sama閱讀 40,430評論 3 420
  • 文/蒼蘭香墨 我猛地睜開眼焰薄,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了扒袖?” 一聲冷哼從身側響起塞茅,我...
    開封第一講書人閱讀 39,342評論 0 276
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎季率,沒想到半個月后野瘦,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,801評論 1 317
  • 正文 獨居荒郊野嶺守林人離奇死亡飒泻,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 37,976評論 3 337
  • 正文 我和宋清朗相戀三年鞭光,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片泞遗。...
    茶點故事閱讀 40,115評論 1 351
  • 序言:一個原本活蹦亂跳的男人離奇死亡衰猛,死狀恐怖,靈堂內的尸體忽然破棺而出刹孔,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 35,804評論 5 346
  • 正文 年R本政府宣布髓霞,位于F島的核電站卦睹,受9級特大地震影響,放射性物質發(fā)生泄漏方库。R本人自食惡果不足惜结序,卻給世界環(huán)境...
    茶點故事閱讀 41,458評論 3 331
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望纵潦。 院中可真熱鬧徐鹤,春花似錦、人聲如沸邀层。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,008評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽寥院。三九已至劲赠,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間秸谢,已是汗流浹背凛澎。 一陣腳步聲響...
    開封第一講書人閱讀 33,135評論 1 272
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留估蹄,地道東北人塑煎。 一個月前我還...
    沈念sama閱讀 48,365評論 3 373
  • 正文 我出身青樓,卻偏偏與公主長得像臭蚁,于是被迫代替她去往敵國和親最铁。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 45,055評論 2 355

推薦閱讀更多精彩內容