卡卡網

在前面文章曾介紹過JS三種聲明方式：var,let,const，在本文中，將進一步探討JS中的變量var、let和const。本文將幫助你理解為什么要使用 const 和 let 、 var 以及在哪里使用它們。

var

var 在 Javascript 中一直使用，而 let 和 const 在 ES6 版本中被引入。使用var變量，你可以將值重新分配給變量，也可以使用 var 關鍵字重新聲明變量。

例子：

var b = "Hello" 
var b = "Hey" // 用戶可以使用 var 關鍵字重新聲明它
b = "nice" // 你也可以為變量重新賦值

范圍

var 關鍵字具有全局作用域或函數作用域。這意味著如果任何帶有 var 關鍵字的變量被全局聲明（在函數外部），那么它可以在函數內部訪問，也可以全局訪問。看例子就明白了。

示例 1

var b = "你好" 
function Checkb(){ 
    console.log(b) 
} 
console.log(b);

說明：在上面的示例中，可以看到帶有 var 關鍵字的變量“b”是全局聲明的，我們嘗試在函數內部兩次獲取值，第二次在全局（函數外部）獲取值，因此兩種方式都得到了正確的結果。查看輸出：

"你好"
"你好"

但是如果在函數內部聲明了帶有 var 關鍵字的變量“b”，那么它只能在函數內部訪問，不能在函數外部訪問，并引發(fā)引用錯誤。

示例2

function f() { 
  var b = "你好"; // 可以在這個函數中任何地方訪問 b
  console.log(b) 
} 
f(); 
 
console.log(b); // b 不可訪問
               // 因為在函數之外

輸出

解釋

在第二個例子中，變量“b”是在函數內部聲明的，所以我們嘗試在函數內部和外部獲取它一次。第一個我們得到了預期的結果，但第二個我們得到了 ReferenceError ，因為帶有 var 關鍵字的變量在函數之外是不可訪問的。

所以我們知道了全局作用域，var關鍵字也有函數作用域。

let

正如上面提到的，在 ES6 中引入了let 。let是var的改進版本。使用 let 關鍵字，可以將值重新分配給變量，但不能使用 let 關鍵字重新聲明變量。

例子

let b = 1 
let b = 2 //錯誤~用戶不能再次重新聲明變量
b = "0" // 你可以重新賦值給變量

解釋

變量“b”已經用 let 關鍵字聲明了，所以不能重新聲明它。如果這樣做，會得到 SyntaxError( b has been defined )，但是可以像上面所做的那樣將值重新分配給變量。 

范圍

let有塊作用域，{}里面的任何東西都被認為是一個塊。塊作用域意味著如果在塊內聲明了“b”變量，那么它在塊外是不可訪問的。

例子：

let c = 10
if (c == 10) {
  let a = "你好"
  console.log(a) 
}
console.log(a)

輸出

你好
ReferenceError: a is not defined

解釋

我們試圖在聲明“a”的塊中獲取“a”的值，因此我們得到了預期的值。但是第二次我們沒有得到預期的值，而是得到了 ReferenceError ，因為“a”是在塊內聲明的，如果我們嘗試在塊外訪問它會顯示錯誤。發(fā)生這種情況是因為使用 let 關鍵字聲明的任何變量都變成了塊作用域。

const

ES6中還引入了 const 關鍵字。const是不言自明的,它是一個常量，它保持恒定值。雖然let的性質與const有很大不同，但它們都有很多相似之處，就像它們都具有塊作用域一樣。const關鍵字具有與let關鍵字相同的所有屬性，除了用戶無法更新它的屬性。請參閱下面的示例：

//let
let a = "john"
a = "micheal"       //值被更改

//const
const b = "red"
b = "blue"       //會提示錯誤因為不能被更改

使用 const 關鍵字，不能重新分配值，也不能用 const 重新聲明變量。如果這樣做會提示錯誤。

例子

const b = "red" 
const b = "green" // 不允許重新聲明
b = "yellow" // 不允許重新賦值

范圍

正如之前提到的， const 也有像 let 這樣的塊作用域。塊范圍是什么，上面已經說清楚了。

例子

{
  const x = 9
  console.log(x)
}
 
console.log(x)

輸出

9
ReferenceError: x is not defined

何時使用var、let和const

使用 const 關鍵字，代碼變得更干凈，使用 var 關鍵字，代碼變得混亂，因為如果在長代碼中錯誤地將值重新分配給使用 var 關鍵字的變量，則很難調試代碼。所以開發(fā)人員最喜歡的是 const 和 let，特別是 const 使代碼更干凈，并且易于調試錯誤。

結論

在結束之前，先總結一下剛剛了解的內容：

var：函數范圍，可以更新和重新聲明。

let：塊作用域，可以更新，但不能重新聲明。

const：塊作用域，不能更新和重新聲明。

相關文章

• 實例詳解區(qū)別JS三種聲明方式：var,let,const
• [解決]重聲明錯誤類型Uncaught SyntaxError: redeclaration of ...

標簽: let  var  const