摘要:變量用命令聲明,不會(huì)發(fā)生變量提升。報(bào)錯(cuò)不報(bào)錯(cuò)塊級(jí)作用域?qū)嶋H上為新增了塊級(jí)作用域。這表示外層代碼塊不受內(nèi)層代碼塊的影響。以下兩行都會(huì)報(bào)錯(cuò)聲明變量的六種方法只有兩種聲明變量的方法命令和命令。之中,頂層對(duì)象的屬性與全局變量是等價(jià)的。
let 與 cost
1.使用 let 關(guān)鍵字聲明變量,與使用 var 關(guān)鍵字聲明變量書寫方式一致;
{ let a = 10; var b = 1; } a // ReferenceError: a is not defined. b // 1
上面代碼在代碼塊之中,分別用 let 和 var 聲明了兩個(gè)變量。然后在代碼塊之外調(diào)用這兩個(gè)變量,結(jié)果let聲明的變量報(bào)錯(cuò),var聲明的變量返回了正確的值。這表明,let聲明的變量只在它所在的代碼塊有效。
通過(guò)一個(gè)簡(jiǎn)單的循環(huán)來(lái)初步了解使用 let 關(guān)鍵字聲明變量 與 傳統(tǒng)的 var 關(guān)鍵字聲明變量的區(qū)別
var a = []; for (var i = 0; i < 10; i++) { a[i] = function() { console.log(i); }; } a[6](); // 10
上面代碼中,變量i是var命令聲明的,在全局范圍內(nèi)都有效,所以全局只有一個(gè)變量i。每一次循環(huán),變量i的值都會(huì)發(fā)生改變,而循環(huán)內(nèi)被賦給數(shù)組a的函數(shù)內(nèi)部的console.log(i),里面的i指向的就是全局的i。也就是說(shuō),所有數(shù)組a的成員里面的i,指向的都是同一個(gè)i,導(dǎo)致運(yùn)行時(shí)輸出的是最后一輪的i的值,也就是 10。
var a = []; for (let i = 0; i < 10; i++) { a[i] = function() { console.log(i); }; } a[6](); // 6
而這段代碼中,變量i是let聲明的,當(dāng)前的i只在本輪循環(huán)有效,所以每一次循環(huán)的i其實(shí)都是一個(gè)新的變量,所以最后輸出的是6。你可能會(huì)問(wèn),如果每一輪循環(huán)的變量i都是重新聲明的,那它怎么知道上一輪循環(huán)的值,從而計(jì)算出本輪循環(huán)的值?這是因?yàn)?JavaScript 引擎內(nèi)部會(huì)記住上一輪循環(huán)的值,初始化本輪的變量i時(shí),就在上一輪循環(huán)的基礎(chǔ)上進(jìn)行計(jì)算。
2.不存在變量提升
// var 的情況 console.log(foo); // 輸出undefined var foo = 2; // let 的情況 console.log(bar); // 報(bào)錯(cuò)ReferenceError let bar = 2;
上面代碼中,變量foo用var命令聲明,會(huì)發(fā)生變量提升,即腳本開(kāi)始運(yùn)行時(shí),變量foo已經(jīng)存在了,但是沒(méi)有值,所以會(huì)輸出undefined。變量bar用let命令聲明,不會(huì)發(fā)生變量提升。這表示在聲明它之前,變量bar是不存在的,這時(shí)如果用到它,就會(huì)拋出一個(gè)錯(cuò)誤。
3.暫時(shí)性死區(qū)
在代碼塊內(nèi),使用let命令聲明變量之前,該變量都是不可用的。這在語(yǔ)法上,稱為“暫時(shí)性死區(qū)”(temporal dead zone,簡(jiǎn)稱 TDZ)
if (true) { // TDZ開(kāi)始 tmp = "abc"; // ReferenceError console.log(tmp); // ReferenceError let tmp; // TDZ結(jié)束 console.log(tmp); // undefined tmp = 123; console.log(tmp); // 123 }
上面代碼中,存在全局變量tmp,但是塊級(jí)作用域內(nèi)let又聲明了一個(gè)局部變量tmp,導(dǎo)致后者綁定這個(gè)塊級(jí)作用域,所以在let聲明變量前,對(duì)tmp賦值會(huì)報(bào)錯(cuò)
4.不允許重復(fù)聲明
let不允許在相同作用域內(nèi),重復(fù)聲明同一個(gè)變量。
// 報(bào)錯(cuò) function func() { let a = 10; var a = 1; } // 報(bào)錯(cuò) function func() { let a = 10; let a = 1; }
因此,不能在函數(shù)內(nèi)部重新聲明參數(shù)。
function func(arg) { let arg; } func() // 報(bào)錯(cuò) function func(arg) { { let arg; } } func() // 不報(bào)錯(cuò)
5.塊級(jí)作用域
let實(shí)際上為 JavaScript 新增了塊級(jí)作用域。
function f1() { let n = 5; if (true) { let n = 10; } console.log(n); // 5 }
上面的函數(shù)有兩個(gè)代碼塊,都聲明了變量n,運(yùn)行后輸出 5。這表示外層代碼塊不受內(nèi)層代碼塊的影響。如果兩次都使用var定義變量n,最后輸出的值才是 10
6.const
const聲明一個(gè)只讀的常量。一旦聲明,常量的值就不能改變。
const PI = 3.1415; PI // 3.1415 PI = 3; // TypeError: Assignment to constant variable.
const聲明的變量不得改變值,這意味著,const一旦聲明變量,就必須立即初始化,不能留到以后賦值 const的作用域與let命令相同:只在聲明所在的塊級(jí)作用域內(nèi)有效
if (true) { const MAX = 5; } MAX // Uncaught ReferenceError: MAX is not defined
const命令聲明的常量也是不提升,同樣存在暫時(shí)性死區(qū),只能在聲明的位置后面使用 const聲明的常量,也與let一樣不可重復(fù)聲明。
var message = "Hello!"; let age = 25; // 以下兩行都會(huì)報(bào)錯(cuò) const message = "Goodbye!"; const age = 30;
ES6 聲明變量的六種方法 ES5 只有兩種聲明變量的方法:var命令和function命令。ES6 除了添加let和const命令;還有import命令和class命令(這兩與本文關(guān)系不大,了解即可)
7.頂層對(duì)象的屬性
頂層對(duì)象,在瀏覽器環(huán)境指的是window對(duì)象,在 Node 指的是global對(duì)象。ES5 之中,頂層對(duì)象的屬性與全局變量是等價(jià)的。
window.a = 1; a // 1 a = 2; window.a // 2
上面代碼中,頂層對(duì)象的屬性賦值與全局變量的賦值,是同一件事。
ES6 為了改變這一點(diǎn),一方面規(guī)定,為了保持兼容性,var命令和function命令聲明的全局變量,依舊是頂層對(duì)象的屬性;另一方面規(guī)定,let命令、const命令、class命令聲明的全局變量,不屬于頂層對(duì)象的屬性
而在ES6(ECMAScript 6 以下簡(jiǎn)稱 ES6)語(yǔ)法中,就會(huì)報(bào)錯(cuò)
var a = 1; let b = 1; window.b // undefined
上面代碼中,全局變量a由var命令聲明,所以它是頂層對(duì)象的屬性;全局變量b由let命令聲明,所以它不是頂層對(duì)象的屬性,返回undefined。
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://specialneedsforspecialkids.com/yun/102300.html
摘要:可以直譯為古怪到有魅力。里面基本上這些是被弱化了的,或者說(shuō)是被隱藏起來(lái)了。而之前的的語(yǔ)法使得入門的門檻變高了。但是,于此同時(shí),作為語(yǔ)言的獨(dú)特魅力被削弱了。應(yīng)該說(shuō),理解這些傳統(tǒng)的語(yǔ)法對(duì)也很有意義。因?yàn)楫吘惯@些只是被隱藏,而不是被剔除。 這兩天在看React的一些東西。接觸到了ES6。談?wù)勔恍┐譁\的看法。 ES6其實(shí)是個(gè)簡(jiǎn)稱。這東西學(xué)名叫做ECMAScript 2015,或者ES 2015...
摘要:當(dāng)發(fā)出一個(gè)請(qǐng)求的時(shí)候,如果這個(gè)請(qǐng)求需要等待,那就會(huì)被放入隊(duì)列中,如果有別的請(qǐng)求發(fā)出,并且無(wú)需等待則立刻做出處理,之后,再調(diào)用該請(qǐng)求的回調(diào)。差異相對(duì)于瀏覽器而言是沒(méi)有對(duì)象的也沒(méi)有瀏覽器安全級(jí)別的限制也不具備只能運(yùn)行 node初體驗(yàn) 1、node環(huán)境 node 是一個(gè)服務(wù)端JavaScript解析器,node中this指向global,而在瀏覽器中this指向window 所以u(píng)nde...
摘要:經(jīng)濟(jì)基礎(chǔ)決定上層建筑。以下暫不考慮嚴(yán)格模式。在全局執(zhí)行下,無(wú)論是否在嚴(yán)格模式下,指向全局對(duì)象。在其他函數(shù)內(nèi)部的箭頭函數(shù),這些箭頭函數(shù)的保留。當(dāng)一個(gè)用于在的事件監(jiān)聽(tīng)中,指向這個(gè)元素。 經(jīng)濟(jì)基礎(chǔ)決定上層建筑。 我來(lái)了 學(xué)習(xí),記錄,備忘。 感謝參考過(guò)的所有資料的作者。 嗯,能看源碼的就不要看文檔,能看英文文檔的就不要看中文文檔,能自己上手驗(yàn)證的就不要僅僅參考。請(qǐng)保持質(zhì)疑。深有所感。 t...
摘要:綁定事件后的返回值。設(shè)置屬性,將要設(shè)置的新屬性,該狀態(tài)會(huì)和當(dāng)前的合并,可選參數(shù),回調(diào)函數(shù)。方法與類似,但它會(huì)刪除原有強(qiáng)制更新參數(shù)說(shuō)明,可選參數(shù),回調(diào)函數(shù)。判斷組件掛載狀態(tài)返回值或,表示組件是否已掛載到中方法用于判斷組件是否已掛載到中。 React 特點(diǎn) 聲明式設(shè)計(jì) ?React采用聲明范式,可以輕松描述應(yīng)用。 高效 ?React通過(guò)對(duì)DOM的模擬,最大限度地減少與DOM的交互。 靈活...
摘要:摘要實(shí)踐內(nèi)存初探閑魚技術(shù)匠修我們想使用來(lái)統(tǒng)一移動(dòng)開(kāi)發(fā)并做了一些實(shí)踐。將內(nèi)存管理分為新生代和老年代。在標(biāo)記階段,所有線程參與并發(fā)的完成對(duì)回收對(duì)象的標(biāo)記,降低標(biāo)記階段耗時(shí)。的首幀渲染耗時(shí)較高,在版本有明顯感受,大概會(huì)黑屏秒,版本會(huì)好很多。 摘要: Android Flutter實(shí)踐內(nèi)存初探 閑魚技術(shù)-匠修我們想使用Flutter來(lái)統(tǒng)一移動(dòng)App開(kāi)發(fā)并做了一些實(shí)踐。移動(dòng)設(shè)備上的資源有限,通常...
閱讀 2571·2021-09-26 10:13
閱讀 5969·2021-09-08 10:46
閱讀 686·2019-08-30 15:53
閱讀 2957·2019-08-29 16:13
閱讀 2750·2019-08-26 12:23
閱讀 3478·2019-08-26 11:24
閱讀 1085·2019-08-23 18:09
閱讀 1028·2019-08-23 17:08