摘要:我們一起看一下和的引入對現有的編碼方式會帶來哪些影響。和的引入同樣改變了這種現象作用域變量和對象屬性分得清清楚楚。和引入后,每次循環都會創建特定于當次循環作用域的局部變量。
塊級作用域let&const
js給人的感覺往往是用起來比較簡單,語法上寬松。這給開發者帶來便利的同時也造成了一些違反思維習慣的別扭之處。es6一些新的特性的引入,可以認為試圖糾正或補齊js最初設計的缺陷。
我們一起看一下let和const的引入對現有的編碼方式會帶來哪些影響。
變量聲明提升眾所周知,變量聲明提升是js中非常最重要的特性之一。也是面試中常被問到的點。但對于js新人來說可能覺得難以理解,甚至違反直覺。變量沒有聲明之前不應該能訪問??!
console.log(v1)// undefined var v1 = 1 console.log(v1) // 1
上面這段代碼對于新手來說,undefined的結果是難以理解的。(心想不應該報錯么?)
console.log(v1) // Uncaught ReferenceError: v1 is not defined let v1 = 1 console.log(v1) // 1
使用let之后從邏輯上是符合開發者的思維習慣的 未聲明之前使用就是會報引用錯誤,在聲明之后訪問變量的值正常返回變量值。
let和const聲明的變量是不會被提升的,真正實現了使用前聲明,聲明后再使用。
全局變量不會變成window的屬性以前在全局作用域下聲明變量時,全局變量自然而然的成為了全局對象的屬性如:
var a = 1 console.log(window.a === a) // true
對于這種情況前端開發工程師早已爛熟于心了。let和 const的引入同樣改變了這種現象:
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循環沒有陷阱看下這個前端圈用濫的面試題:
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循環的代碼塊外溢。
let和const引入后,每次循環都會創建特定于當次循環作用域的局部變量。換句話說每次循環都有與之綁定的i值。執行完成之后即銷毀。不會外溢到外層作用域。下面的代碼是符合預期的:
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最佳實踐
為了避免代碼中出現意外驚喜,日常coding中首先是使用const,可以有效避免變量被意外修改。如果變量有被修改的需求首選使用 let。var的使用盡量減少使用。
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/90209.html
摘要:關于本書,我會寫好幾篇讀書筆記用以記錄那些讓我恍然大悟的瞬間,本文是第一篇弄懂的作用域和閉包。作用域也可以看做是一套依據名稱查找變量的規則。聲明實際上是根據你傳遞給它的對象憑空創建了一個全新的詞法作用域。 《你不知道的JavaScript》真的是一本好書,閱讀這本書,我有多次哦,原來是這樣的感覺,以前自以為理解了(其實并非真的理解)的概念,這一次真的理解得更加透徹了。關于本書,我會寫好...
摘要:下面,我就從基本對象說起,聊一聊不可變數據和的一切??勺兒凸蚕硎侨f惡之源不可變數據其實是函數式編程相關的重要概念。相對的,函數式編程中認為可變性是萬惡之源。針對于此,我推薦一款已經大名鼎鼎的類庫來處理不可變數據。 作為前端開發者,你會感受到JS中對象(Object)這個概念的強大。我們說JS中一切皆對象。最核心的特性,例如從String,到數組,再到瀏覽器的APIs,對象這個概念無處不...
摘要:這也是前端面試經常詢問的問題,經常問你出現了哪些新的特性,平時又使用過那些。 這也是前端面試經常詢問的問題,經常問你es6出現了哪些新的特性,平時又使用過那些。在編寫此教程的時候,第一句話往往就是面試常常問到的地方,然后后面就是他的詳細解釋,面試要求的內容我會用*標記出來。寫技術文檔是真的累啊,雖然是看別人的文檔,但是你得看很多,而且還得自己總結啊。所以說要是覺得對你有用還是幫我點個s...
摘要:這也是前端面試經常詢問的問題,經常問你出現了哪些新的特性,平時又使用過那些。 這也是前端面試經常詢問的問題,經常問你es6出現了哪些新的特性,平時又使用過那些。在編寫此教程的時候,第一句話往往就是面試常常問到的地方,然后后面就是他的詳細解釋,面試要求的內容我會用*標記出來。寫技術文檔是真的累啊,雖然是看別人的文檔,但是你得看很多,而且還得自己總結啊。所以說要是覺得對你有用還是幫我點個s...
閱讀 2066·2021-11-11 16:54
閱讀 1046·2021-10-12 10:12
閱讀 386·2019-08-30 15:43
閱讀 652·2019-08-29 13:15
閱讀 1080·2019-08-29 13:12
閱讀 1531·2019-08-26 12:09
閱讀 1662·2019-08-26 10:24
閱讀 2263·2019-08-26 10:15