JS中l(wèi)et用法

基本用法

Let命令用來聲明變量。它的用法類似于var，但是所聲明的變量。只在let命令所在的代碼塊內(nèi)有效。

上面代碼塊中，分別用let和var聲明了兩個(gè)變量。然后在代碼塊之外調(diào)用這兩個(gè)變量，結(jié)果let聲明的變量報(bào)錯(cuò)，var聲明的變量返回了正確的值。這表明，let聲明的變量只在它所在的代碼塊有效。

還有：

-var聲明的變量，可以預(yù)解析提前調(diào)用的結(jié)果是undefined，let定義的變量不能預(yù)解析，提前調(diào)用的結(jié)果是報(bào)錯(cuò)。

-var定義的變量，變量名可以重復(fù)，效果是重復(fù)賦值，let定義的變量不能重復(fù)，否則執(zhí)行報(bào)錯(cuò)。

-塊級作用域{}，一個(gè){}可以看作一個(gè)作用域，if語句和for語句里面的{}也屬于塊作用域

很適合for循環(huán)的計(jì)數(shù)器

例如：

上面代碼中，變量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，也就是說，所有數(shù)組a的成員里面的i，指向的都是同一個(gè)i，導(dǎo)致運(yùn)行時(shí)輸出的是最后一輪的i的值，也就是10.

如果使用let，聲明的變量僅在塊級作用域內(nèi)有效，最后輸出的是6，

上面代碼中，變量i是let聲明的，當(dāng)前的i只在本輪循環(huán)有效，所以每一次循環(huán)的i其實(shí)都是一個(gè)新的變量，所以最后輸出的是6。JavaScript引擎內(nèi)部會(huì)記住上一輪循環(huán)的值，初始化本輪的變量i時(shí)，就在上一輪循環(huán)的基礎(chǔ)上進(jìn)行計(jì)算。

• 暫時(shí)性死區(qū)TDZ

-TDZ又叫暫時(shí)性死區(qū)，意思是變量在作用域內(nèi)已經(jīng)存在，必須在let/const聲明后面使用。

只要塊級作用域內(nèi)存在let命令，它所聲明的變量就“綁定”（binding）這個(gè)區(qū)域，不再受外部的影響。

上面代碼中，存在全局變量a，但是塊級作用域內(nèi)let又聲明了一個(gè)局部變量a，導(dǎo)致后者綁定這個(gè)塊級作用域，所以在let聲明變量前，對a賦值會(huì)報(bào)錯(cuò)。

ES6明確規(guī)定，如果區(qū)塊中存在let和const命令，這個(gè)區(qū)塊對這些命令聲明的變量，從一開始就形成了封閉作用域。凡是在聲明之前就 使用這些變量，就會(huì)報(bào)錯(cuò)。

例如：

在聲明變量之前都屬于該變量的“死區(qū)”.

-TDZ本質(zhì)：只要一進(jìn)入當(dāng)前作用域，所要使用的變量就已經(jīng)存在，但是不可獲取，只有等到聲明變量的那一行代碼出現(xiàn)，才可以獲取和使用該變量。

TDZ也意味著typeof不再是一個(gè)百分百安全的操作。

如果

typeof a；

Let a；

變量a，使用let命令聲明之前，都屬于a的“死區(qū)”,只要用到該變量就會(huì)報(bào)錯(cuò)。因此，typeof運(yùn)行時(shí)就會(huì)拋出一個(gè)ReferenceError.

作為比較，如果一個(gè)變量根本沒有被聲明，使用typeof反而不會(huì)報(bào)錯(cuò)。

ES6規(guī)定暫時(shí)性死區(qū)和let，const語句不出現(xiàn)變量提升，主要是為了減小運(yùn)行時(shí)的錯(cuò)誤，防止變量在聲明前就使用這個(gè)變量。

補(bǔ)充：var和let的區(qū)別

區(qū)別：

1.使用var聲明的變量，其作用域?yàn)樵撜Z句所在的函數(shù)內(nèi)，且存在變量提升現(xiàn)象；

2.使用let聲明的變量，其作用域?yàn)樵撜Z句所在的代碼塊內(nèi)，不存在變量提升；

3.let不允許在相同作用域內(nèi)，重復(fù)聲明同一個(gè)變量。

總結(jié)

到此這篇關(guān)于JS中l(wèi)et的基本用法舉例的文章就介紹到這了,更多相關(guān)JS let用法內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

最新評論