一文詳解JS中的塊級作用域

更新時間：2023年09月10日 08:18:49 作者：編程三昧

在JavaScript的世界里,作用域可以分為三種,分別是全局作用域,函數(shù)作用域,塊級作用域,本文主要來和大家聊聊JS中塊級作用域的相關知識,感興趣的可以了解下

Let

這與var類似，但有一些顯著差異。由于它聲明的變量具有塊級作用域，所以可以在不影響外部變量的情況下聲明具有相同名稱的新局部（內部）變量。

var a = 'car' ;
{
    let a = 5;
    console.log(a) // 5
}
console.log(a) // car

因為它綁定到一個塊（即就是 { 和 } 之間的范圍），它解決了這個經(jīng)典的面試問題：“輸出是什么，如何讓它按照你的期望工作？”

for (var i = 1; i < 5; i++){
    setTimeout(() => { console.log(i); }, 1000);
}

在這種情況下，它會輸出 “5 5 5 5 5”，因為變量 i 在每次迭代中都會被改變，最終所有結果以最后一次變更為準。

如果您將var切換為let，那就不一樣了?，F(xiàn)在，每個循環(huán)都會創(chuàng)建一個新的塊作用域，其值為綁定到該循環(huán)的值。相當于你寫了：

{let i = 1; setTimeout(() => { console.log(i) }, 1000)}
{let i = 2; setTimeout(() => { console.log(i) }, 1000)}
{let i = 3; setTimeout(() => { console.log(i) }, 1000)}
{let i = 4; setTimeout(() => { console.log(i) }, 1000)}
{let i = 5; setTimeout(() => { console.log(i) }, 1000)}

var和let之間的另一個區(qū)別是let不會像var一樣被提升。

{
    console.log(a); // undefined
    console.log(b); // ReferenceError
    var a = 'car';
    let b = 5;
}

由于其更嚴格的范圍界定和更可預測的行為，有些人表示應該使用let而不是var，除非特別需要用var的聲明提升或需要其更寬松的作用范圍。

Const

如果你想在 JavaScript 中聲明一個常量變量，那么慣例是將變量命名大寫。然而，這并不能保證它是一個常量 - 它只是讓其他開發(fā)人員知道這是一個常量，不應該改變。

現(xiàn)在我們有了const聲明。

{
    const c = "tree";
    console.log(c);  // tree
    c = 46;  // TypeError!
}

const 不會使變量不可變，只是鎖定它的賦值。如果你有一個復雜的賦值（對象或數(shù)組），那么該值仍然可以修改。

{
    const d = [1, 2, 3, 4];
    const dave = { name: 'David Jones', age: 32};
    d.push(5);
    dave.job = "salesman";
    console.log(d);  // [1, 2, 3, 4, 5]
    console.log(dave);  // { age: 32, job: "salesman", name: 'David Jones'}
}

到此這篇關于一文詳解JS中的塊級作用域的文章就介紹到這了,更多相關JS塊級作用域內容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家！

您可能感興趣的文章: