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

資訊專欄INFORMATION COLUMN

let和const的引入會對js編程帶來哪些改變？

xavier / 1949人閱讀

摘要：我們一起看一下和的引入對現(xiàn)有的編碼方式會帶來哪些影響。和的引入同樣改變了這種現(xiàn)象作用域變量和對象屬性分得清清楚楚。和引入后，每次循環(huán)都會創(chuàng)建特定于當次循環(huán)作用域的局部變量。

塊級作用域let&const

js給人的感覺往往是用起來比較簡單，語法上寬松。這給開發(fā)者帶來便利的同時也造成了一些違反思維習慣的別扭之處。es6一些新的特性的引入，可以認為試圖糾正或補齊js最初設(shè)計的缺陷。

我們一起看一下let和const的引入對現(xiàn)有的編碼方式會帶來哪些影響。

變量聲明提升

眾所周知，變量聲明提升是js中非常最重要的特性之一。也是面試中常被問到的點。但對于js新人來說可能覺得難以理解，甚至違反直覺。變量沒有聲明之前不應該能訪問?。?/p> 

console.log(v1)// undefined
var v1 = 1
console.log(v1) // 1

上面這段代碼對于新手來說，undefined的結(jié)果是難以理解的。（心想不應該報錯么？）

console.log(v1) // Uncaught ReferenceError: v1 is not defined
let v1 = 1
console.log(v1) // 1

使用let之后從邏輯上是符合開發(fā)者的思維習慣的 未聲明之前使用就是會報引用錯誤，在聲明之后訪問變量的值正常返回變量值。

let和const聲明的變量是不會被提升的，真正實現(xiàn)了使用前聲明，聲明后再使用。

全局變量不會變成window的屬性

以前在全局作用域下聲明變量時，全局變量自然而然的成為了全局對象的屬性如：

var a = 1
console.log(window.a === a) // true

對于這種情況前端開發(fā)工程師早已爛熟于心了。let和 const的引入同樣改變了這種現(xiàn)象：

let a = 1
console.log(window.a) // undefined
console.log(a) // 1
window.a = 2
console.log(window.a) //2
console.log(a) // 1

作用域變量和對象屬性分得清清楚楚。

for循環(huán)沒有陷阱

看下這個前端圈用濫的面試題：

for(var i = 0; i < 5; i++){
    setTimeout(function(){
        console.log(i)
    }, 0)
}
console.log(i)

這題固然難不倒老鳥們。但新手們十有八九會答錯。0 1 2 3 4 5。

是的，從常理來說就應該是這樣的，只不過js中缺少塊級作用域的概念，var聲明的變量自然而然從for循環(huán)的代碼塊外溢。

let和const引入后，每次循環(huán)都會創(chuàng)建特定于當次循環(huán)作用域的局部變量。換句話說每次循環(huán)都有與之綁定的i值。執(zhí)行完成之后即銷毀。不會外溢到外層作用域。下面的代碼是符合預期的：

for(let i = 0; i<5; i++){
    setTimeout(function(){
        console.log(i) //0 1 2 3 4
    }, 0)
}
console.log(i) //  ReferenceError: i is not defined
最佳實踐

為了避免代碼中出現(xiàn)意外驚喜，日常coding中首先是使用const，可以有效避免變量被意外修改。如果變量有被修改的需求首選使用 let。var的使用盡量減少使用。

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

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

相關(guān)文章

  • 弄懂JavaScript的作用域和閉包

    摘要：關(guān)于本書，我會寫好幾篇讀書筆記用以記錄那些讓我恍然大悟的瞬間，本文是第一篇弄懂的作用域和閉包。作用域也可以看做是一套依據(jù)名稱查找變量的規(guī)則。聲明實際上是根據(jù)你傳遞給它的對象憑空創(chuàng)建了一個全新的詞法作用域。 《你不知道的JavaScript》真的是一本好書，閱讀這本書，我有多次哦，原來是這樣的感覺，以前自以為理解了（其實并非真的理解）的概念，這一次真的理解得更加透徹了。關(guān)于本書，我會寫好...

    everfly 評論0 收藏0

  • 從JS對象開始，談一談“不可變數(shù)據(jù)”和函數(shù)式編程

    摘要：下面，我就從基本對象說起，聊一聊不可變數(shù)據(jù)和的一切。可變和共享是萬惡之源不可變數(shù)據(jù)其實是函數(shù)式編程相關(guān)的重要概念。相對的，函數(shù)式編程中認為可變性是萬惡之源。針對于此，我推薦一款已經(jīng)大名鼎鼎的類庫來處理不可變數(shù)據(jù)。 作為前端開發(fā)者，你會感受到JS中對象(Object)這個概念的強大。我們說JS中一切皆對象。最核心的特性，例如從String，到數(shù)組，再到瀏覽器的APIs，對象這個概念無處不...

    Batkid 評論0 收藏0

  • 前端面試之ES6篇（高產(chǎn)似母豬）

    摘要：這也是前端面試經(jīng)常詢問的問題，經(jīng)常問你出現(xiàn)了哪些新的特性，平時又使用過那些。 這也是前端面試經(jīng)常詢問的問題，經(jīng)常問你es6出現(xiàn)了哪些新的特性，平時又使用過那些。在編寫此教程的時候，第一句話往往就是面試常常問到的地方，然后后面就是他的詳細解釋，面試要求的內(nèi)容我會用*標記出來。寫技術(shù)文檔是真的累啊，雖然是看別人的文檔，但是你得看很多，而且還得自己總結(jié)啊。所以說要是覺得對你有用還是幫我點個s...

    BlackMass 評論0 收藏0

  • 前端面試之ES6篇（高產(chǎn)似母豬）

    摘要：這也是前端面試經(jīng)常詢問的問題，經(jīng)常問你出現(xiàn)了哪些新的特性，平時又使用過那些。 這也是前端面試經(jīng)常詢問的問題，經(jīng)常問你es6出現(xiàn)了哪些新的特性，平時又使用過那些。在編寫此教程的時候，第一句話往往就是面試常常問到的地方，然后后面就是他的詳細解釋，面試要求的內(nèi)容我會用*標記出來。寫技術(shù)文檔是真的累啊，雖然是看別人的文檔，但是你得看很多，而且還得自己總結(jié)啊。所以說要是覺得對你有用還是幫我點個s...

    seal_de 評論0 收藏0

發(fā)表評論

0條評論

xavier

男|高級講師

TA的文章

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