JavaScript 塊級作用域

如果掌握C#或者Java標準物件導向的語言，那麼此概念非常容易理解，因為幾乎完全相同。

在ES2015之前，只有函式作用域和全域性作用域，具體參閱JavaScript作用域一章節。

程式碼例項如下：

[JavaScript] 純文字檢視 複製程式碼執行程式碼
function func() {
  var antzone = "螞蟻部落";
}
func()
console.log(antzone);

上面的程式碼會報錯，因為變數antzone只在函式作用域中有效。

再來看一段程式碼例項:

[JavaScript] 純文字檢視 複製程式碼執行程式碼
for (var index = 0; index < 5; index++) {
  //code
}
console.log(index);

由於上述程式碼沒有采用塊級作用域，那麼index的作用域是全域性的，列印結果是5。

一.塊級作用域概念:

（1）.花括號{}和其中程式碼生成一個塊。

（2）.在塊中，let和const宣告的變數和常量對外都是不可見的，稱之為塊級作用域。

（3）.只有使用let和const宣告的變數或者常量在塊中對外不可見，var宣告的變數對外依然可見。

可以這麼認為，是let和const建立了塊級作用域。

關於let和const可以參閱以下兩篇文章：

（1）.let可以參閱ES2015 let命令一章節。

（2）.const可以參閱ES2015 const命令一章節。

程式碼例項:

[JavaScript] 純文字檢視 複製程式碼執行程式碼
if (true) {
  let address = "青島市南區";
}
console.log(address);

使用let宣告的變數address只在所在塊級作用域內有效。

二.語句塊和物件直接量的區別:

不要把物件直接量看做是塊級作用域，程式碼如下:

[JavaScript] 純文字檢視 複製程式碼
var obj = {
  webName: "螞蟻部落",
  url: "softwhy.com",
  address:"青島市南區"
}

上面的程式碼使用大括號建立了一個物件直接量，我們不能認為這是一個語句塊。再來看一段程式碼例項:

[JavaScript] 純文字檢視 複製程式碼
{
  webName: "螞蟻部落",
  url: "softwhy.com",
  address:"青島市南區"
}

程式碼會報錯，因為如果程式碼最左邊為大括號，那麼就會被解讀為語句，而不是物件直接量。

上面的程式碼會被解讀為標籤語句，具體可以參閱JavaScript 標籤語句一章節。

只要在外面包裹一個小括號就不會報錯了:

[JavaScript] 純文字檢視 複製程式碼
({
  webName: "螞蟻部落",
  url: "softwhy.com",
  address:"青島市南區"
})