成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

ES6 變量和函數(shù)參數(shù)的臨時死區(qū)

entner / 1408人閱讀

摘要：但是值得注意的是，由和定義的變量還擁有一個會讓人恨容易犯錯的特性臨時死區(qū)，下文以簡稱。但是擁有的不僅是變量，函數(shù)的參數(shù)也有，接下來就一一講解。

ES6的第一章便是講新增了let和const這兩個變量，可以用于定義塊級作用域的變量。相對于于var定義的變量，由let和const定義的變量作用域不會被提升。但是值得注意的是，由let和const定義的變量還擁有一個會讓人恨容易犯錯的特性：臨時死區(qū)（Temporal Dead Zone，下文以TDZ簡稱）。但是擁有TDZ的不僅是變量，函數(shù)的參數(shù)也有，接下來就一一講解。
一：變量的臨時死區(qū)
例1：在變量的作用域外引用變量

function testTdz() {
    console.log(colour);
    if(1 === 1){
        let colour = "blue";
    }
}
testTdz(); //undefined

例2：在變量的臨時死區(qū)內(nèi)引用變量

function testTdz() {
    if(1 === 1){
        console.log(colour);
        let colour = "blue";
    }
}
testTDZ(); // Uncaught ReferenceError: Cannot access "colour" before initialization

例3: 在變量作用域且初始化之后引用變量

function testTdz() {
    if(1 === 1){
        let colour = "blue";
        console.log(colour);
    }
}
testTdz();//"blue"

以上的三個例子，例2展示了在變量的臨時死區(qū)內(nèi)引用變量會導(dǎo)致拋出錯誤。再結(jié)合這三個例子我可以準(zhǔn)確地定義出變量的臨時死區(qū)的區(qū)域?yàn)椋?/p> 

1: 在變量的作用域內(nèi)
2: 在變量的定義之前

如果以一張圖來表示的話，就是下圖所示，框起來的區(qū)域：

這里需要特別注意的是，我們在if表達(dá)式里面定義colour變量，那么它的作用域就只是在if表達(dá)式的大括號里面。在testTdz()方法內(nèi)，if表達(dá)式大括號外的區(qū)域不是colour的作用域，那就一定不是它的臨時死區(qū)，在這些地方引用colour變量，是不會造成拋錯的，只是變量的值是undefined，這也是上面的例1所展示的道理。

二：函數(shù)參數(shù)的臨時死區(qū)
我們在定義函數(shù)參數(shù)的時候，其實(shí)在背后，這些參數(shù)就如同用let定義的變量一樣，擁有自己的作用域。這些參數(shù)變量在初始化之前，如果被引用，也會拋出錯誤。當(dāng)我們調(diào)用函數(shù)，會通過參數(shù)的傳值或者默認(rèn)值初始化這些參數(shù)。為了理解函數(shù)參數(shù)的臨時死區(qū)特性，我們先來看一個正確使用函數(shù)參數(shù)的例子：
例1:

function testFunctionTdz(first, second = first + 1) {
    console.log(`first: ${first} || second: ${second}`);
}
testFunctionTdz(1); //first: 1 || second: 2
testFunctionTdz(1, 1); //first: 1 || second: 1

當(dāng)我們執(zhí)行testFunctionTdz(1)的時候，實(shí)際上背后的執(zhí)行代碼是：

let first = 1;
let second = first + 1; // 1 + 1

當(dāng)我們執(zhí)行testFunctionTdz(1, 1) 的時候，實(shí)際執(zhí)行的代碼是：

let first = 1;
let second = 1;

所以上面的兩個調(diào)用都可以正常地調(diào)用下去。接下來我們稍微改造一下上面的代碼，看一個在參數(shù)的臨時死區(qū)引用變量，從而導(dǎo)致程序拋錯的例子：

function testFunctionTdz(first = second + 1, second) {
    console.log(`first: ${first} || second: ${second}`);
}
testFunctionTdz(1, 1); // first: 1 || second: 1
testFunctionTdz(undefined, 1); // Uncaught ReferenceError: Cannot access "second" before initialization

在這個例子，當(dāng)我們執(zhí)行testFunctionTdz(undefined, 1)時，背后的代碼實(shí)際上是：

let first = second; //在這個區(qū)域，就是變量second的臨時死區(qū)，所以會導(dǎo)致程序拋錯
let second = 1;

以上就是變量和函數(shù)參數(shù)的臨時死區(qū)的內(nèi)容，自認(rèn)為應(yīng)該是講得十分清楚了。

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/105874.html

相關(guān)文章

  • ES6系列文章 塊級作用域

    摘要：聲明之函數(shù)作用域和全局作用域。塊級作用域不能重復(fù)聲明臨時性死區(qū)等特性用來解決變量存在的種種問題。塊級作用域終于在外面訪問不到了。一些常量聲明使用聲明的變量名全部大寫。 ES5之前javascript語言只有函數(shù)作用域和全局作用域，使用var來聲明變量，var聲明的變量還存在變量提升使人困惑不已。我們先來復(fù)習(xí)一下ES5的var聲明，再對比學(xué)習(xí)let和const 。 var var聲明之函...

    趙連江 評論0 收藏0

  • 《深入理解ES6》筆記——函數(shù)（3）

    摘要：錯誤的寫法錯誤的寫法中的構(gòu)造函數(shù)新增了支持默認(rèn)參數(shù)和不定參數(shù)。箭頭函數(shù)的簡單理解箭頭函數(shù)的左邊表示輸入的參數(shù)，右邊表示輸出的結(jié)果。但是有了尾調(diào)用優(yōu)化之后，遞歸函數(shù)的性能有了提升。 作為前端切圖仔，越發(fā)覺得自己離不開函數(shù)了。 說到JavaScript函數(shù)，腦子里都是匿名函數(shù)、普通函數(shù)、閉包函數(shù)、構(gòu)造函數(shù)......然后還能說出一大堆函數(shù)的概念。如果你達(dá)到這個水平，那么函數(shù)對你來說沒有難度...

    DoINsiSt 評論0 收藏0

  • ES6系列---函數(shù)

    摘要：形參默認(rèn)值不再影響對象當(dāng)使用默認(rèn)參數(shù)值時，對象的行為與以往有所不同。具有方法的函數(shù)被統(tǒng)稱為構(gòu)造函數(shù)。當(dāng)調(diào)用函數(shù)的方法時，被賦值為新創(chuàng)建對象實(shí)例如果調(diào)用方法，則的值為。 由于JavaScript開發(fā)者多年的不斷抱怨和呼吁，ES6終于大力度地更新了函數(shù)特性，在ES5基礎(chǔ)上進(jìn)行了許多改進(jìn)。 函數(shù)形參的默認(rèn)值 ES5形參默認(rèn)值的實(shí)現(xiàn) 在ES5中，你很可能通過以下這種方式為函數(shù)賦予默認(rèn)值： fu...

    AJie 評論0 收藏0

  • 深入理解ES6筆記（一）塊級作用域綁定

    摘要：和都能夠聲明塊級作用域，用法和是類似的，的特點(diǎn)是不會變量提升，而是被鎖在當(dāng)前塊中。聲明常量，一旦聲明，不可更改，而且常量必須初始化賦值。臨時死區(qū)臨時死區(qū)的意思是在當(dāng)前作用域的塊內(nèi)，在聲明變量前的區(qū)域叫做臨時死區(qū)。 主要知識點(diǎn)有：var變量提升、let聲明、const聲明、let和const的比較、塊級綁定的應(yīng)用場景showImg(https://segmentfault.com/img...

    馬忠志 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<