資訊專欄INFORMATION COLUMN
摘要：為什么要添加塊級作用域之前，變量只有全局作用域也稱全局變量和函數(shù)作用域局部變量，所以會導(dǎo)致以下不合理的情況函數(shù)的局部變量會覆蓋同名的全局變量。這就導(dǎo)致了如果你要在函數(shù)內(nèi)部調(diào)用全局變量，那么函數(shù)內(nèi)聲明的局部變量就一定不能和全局變量同名。
ES 6 新增的塊級作用域let
在2015年之前，JavaScript是沒有塊級作用域的，之后在ES6版本新增了塊級作用域，為了更好的理解ES6這一新特性，我們先提出這幾個問題：
1.什么是塊級作用域？
2.為什么要添加塊級作用域？
3.怎么使用塊級作用域？
塊級作用域，就是指在只能在語句塊這個范圍中起作用，超出這個范圍則無效，其中語句塊，是指將多個語句放在一對大括號{}里面，通常用于流程控制，比如if,for,while等等。
示例while (x < 10) {
if(x>5){
x++;
}
}
這里{if(x>5){x++;}}是一個語句塊，{x++;}也是一個語句塊，巧記：一對大括號就是一個語句塊，就代表一個作用域。
為什么要添加塊級作用域？ES6之前，變量只有全局作用域（也稱全局變量）和函數(shù)作用域（局部變量），所以會導(dǎo)致以下不合理的情況:
1.函數(shù)的局部變量會覆蓋同名的全局變量。 示例 var a = 0
(function() {
console.log("函數(shù)內(nèi)部調(diào)用全局的a：", a) //輸出：函數(shù)內(nèi)部調(diào)用全局的a： 0
})()
console.log("全局變量a：", a) //輸出;全局變量a： 0
var a = 0
;(function() {
console.log("a=", a) //輸出：a= undefined，按理說應(yīng)該輸出a=0
if (false) {
var a = 1
console.log(a)
}
})()
原因
變量提升導(dǎo)致內(nèi)層的 a 變量覆蓋了外層的 a 變量。
這就導(dǎo)致了如果你要在函數(shù)內(nèi)部調(diào)用全局變量，那么函數(shù)內(nèi)聲明的局部變量就一定不能和全局變量同名。
(function() {
console.log(a) //輸出：undefined
if (true) {
for (var a = 0; a < 10; a++) {
var b = 0
console.log(a) //輸出：0~9
}
}
console.log("if之外a：", a) //輸出：if之外a： 10
console.log("if之外b：", b) //輸出：if之外b： 0
})()
原因
在for循環(huán)中聲明的a,b變量，在函數(shù)結(jié)束前并不會被銷毀。
這樣就導(dǎo)致了一些不必要的內(nèi)存消耗。
為了避免這兩個不合理的問題，塊級作用域就出現(xiàn)了。
使用變量命令 let。
示例 (function() {
if (true) {
for (let a = 0; a < 10; a++) {
console.log(a) //輸出：0~9
}
}
console.log("if之外a：", a) //報(bào)錯：ReferenceError: a is not defined
})()
對于let命令的變量：
作用域：變量所在的語句塊，即一對大括號{}；
不存在變量提升，而是“暫時(shí)性死區(qū)”，也就是說從塊級作用域開始到聲明該變量，這段時(shí)間里是不能訪問該變量的；
同一語句塊中，不能被同一變量名不能重復(fù)聲明。
經(jīng)典案例：let命令代替閉包功能
閉包實(shí)現(xiàn)：
var arr = [];
for(var i = 0; i < 2; i++){
arr[i] = (function(i){
return function(){
console.log(i);
};
}(i));
};
arr[1]();
let 實(shí)現(xiàn)：
"use strict";
var arr = [];
for(let i = 0; i < 2; i++){
arr[i] = function(){
console.log(i);
};
};
arr[1]();
參考文章：
ES6中啥是塊級作用域？運(yùn)用在哪些地方？
變量作用域
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/105742.html
摘要：的介紹是新增的命令?；菊Z法聲明的變量，只在其所在其所在的代碼塊內(nèi)有效。不允許在函數(shù)的一級作用域內(nèi)重新聲明參數(shù)。 let的介紹 let是ES6新增的命令。作用：聲明變量。類似于：var。與var的區(qū)別：使用let聲明的變量，只在其所在的代碼塊內(nèi)有效。 定義回顧 聲明變量：可以用var，也可以不用var。是否允許變量提升：允許。是否允許重復(fù)聲明同一個變量：允許。變量的作用域：全局作用域、...
摘要：入門一前言由于最近本人在學(xué)習(xí)，做一些筆記能夠更好的熟悉，就趁此機(jī)會來寫一篇關(guān)于的新人學(xué)習(xí)摘要吧。的作用域與命令相同只在聲明所在的塊級作用域內(nèi)有效。塊級作用域新增方式和實(shí)際上為新增了塊級作用域。同時(shí)，函數(shù)聲明還會提升到所在的塊級作用域的頭部。 ECMAScript6/ES6 入門 一、前言 由于最近本人在學(xué)習(xí)ES6，做一些筆記能夠更好的熟悉，就趁此機(jī)會來寫一篇關(guān)于ES6的新人學(xué)習(xí)摘要吧。...
摘要：塊級作用域存在于兩個地方函數(shù)內(nèi)部。如下例應(yīng)該返回創(chuàng)建數(shù)組的構(gòu)造函數(shù)即這是數(shù)組返回這是數(shù)組從上例，我們可以知道即使全局作用域中已經(jīng)定義了變量或者已經(jīng)存在了屬性，但我們之后定義的變量則會覆蓋之前已經(jīng)定義好的或者已經(jīng)存在的變量屬性。 一.var 聲明與變量提升機(jī)制 在JavaScript中使用var定義一個變量，無論是定義在全局作用域函數(shù)函數(shù)的局部作用域中，都會被提升到其作用域的頂部，這也是...
摘要：聲明變量不存在變量提升。臨時(shí)死區(qū)，而且不能在聲明之前訪問它。禁止重復(fù)聲明相同的變量，否則報(bào)錯。不存在變量提升，一旦執(zhí)行快外就會立即銷毀。聲明不允許修改綁定，但允許修改值，也就是說用創(chuàng)建對象后，可以修改該對象的屬性值。 知識點(diǎn) var 聲明變量： 1、存在變量提升，實(shí)際上var無論在哪里聲明，都會被當(dāng)做當(dāng)前的作用域頂部聲明變量。 2、可以重復(fù)聲明，后聲明的變量會覆蓋前聲明的變量。 let...
閱讀 1309·2021-10-08 10:05
閱讀 4133·2021-09-22 15:54
閱讀 3114·2021-08-27 16:18
閱讀 3113·2019-08-30 15:55
閱讀 1448·2019-08-29 12:54
閱讀 2757·2019-08-26 11:42
閱讀 555·2019-08-26 11:39
閱讀 2139·2019-08-26 10:11
