JavaScript中var，let與const之間有什麼區別-js教程-PHP中文網

JavaScript中var，let與const之間有什麼區別

清浅

發布： 2019-04-22 15:05:21

原創

3791 人瀏覽過

var，let和const的差別在於：var的變數宣告在程式碼執行前且工作範圍在目前執行的上下文中，let是允許建立一個變數但只作用在它的區塊裡，const與let什麼相似唯一的差異是const定義的變數不可更改

本篇文章主要是透過在JavaScript (ES6) 中建立變數的方法來介紹var、 let和const之間的區別，具有一定的參考作用，希望對大家有幫助。

JavaScript中var，let與const之間有什麼區別

【推薦課程：JavaScript教學】

## #####var VS let#########var和let之間的主要差異不是使用函數作用域，而是使用區塊作用域。這意味著使用let關鍵字建立的變數在建立它的「區塊」內以及任何嵌套區塊中都可用。 #########範例######

function discountPrices (prices, discount) {
  var a = []
  for (var i = 0; i < prices.length; i++) {
    var discountedPrice = prices[i] * (1 - discount)
    var finalPrice = Math.round(discountedPrice * 100) / 100
    a.push(finalPrice)
  }  console.log(i) // 3  console.log(discountedPrice) // 150 
  console.log(finalPrice) // 150
  return a
  }

登入後複製

###在上面的範例中之所以能夠在for迴圈之外使用i，discountedPrice和finalPrice，是因為它們是用var宣告的，而var是函數作用域。如果我們將var換成let會發生什麼情況呢？ ###

function discountPrices (prices, discount) {
  let a = []
  for (let i = 0; i < prices.length; i++) {
    let discountedPrice = prices[i] * (1 - discount)
    let finalPrice = Math.round(discountedPrice * 100) / 100
    a.push(finalPrice)
  }  
  console.log(i) // 3  
  console.log(discountedPrice) // 150  
  console.log(finalPrice) // 150
  return a
  }
  discountPrices([100, 200, 300], .5) // 这儿会报错i未定义

登入後複製

###這個案例告訴我們的是，使用let宣告的變數是區塊作用域，而不是函數作用域。因此在「區塊」之外存取i（或discountedPrice或finalPrice）都會報錯######下一個差異與變數提升有關。提升的定義是「JavaScript解釋器會在所謂的『創建』階段將變數宣告賦值為undefined的預設值。#########範例：######

function discountPrices (prices, discount) {  
console.log(discounted) // undefined
  var a = []
  for (var i = 0; i < prices.length; i++) {
    var discountedPrice = prices[i] * (1 - discount)
    var finalPrice = Math.round(discountedPrice * 100) / 100
    a.push(finalPrice)
  }
  console.log(i) // 3
  console.log(discountedPrice) // 150
  console.log(finalPrice) // 150
  return a}

登入後複製

###如果想要在宣告變數之前使用let宣告的變量，而不是未定義（如使用var宣告的那些變數），程式將會報錯###

function discountPrices (prices, discount) {  
console.log(discounted) // 错误
  let a = []
  for (let i = 0; i < prices.length; i++) {
    let discountedPrice = prices[i] * (1 - discount)
    let finalPrice = Math.round(discountedPrice * 100) / 100
    a.push(finalPrice)
  }
  console.log(i) // 3
  console.log(discountedPrice) // 150
  console.log(finalPrice) // 150
  return a}

登入後複製

######結論是#########var ：變數宣告在程式碼執行之前被處理，它的作用範圍在其目前執行的上下文中######let：let語句允許我們建立一個變量，其範圍僅限於使用它的區塊裡。### ######let VS const#########既然已經理解了var和let之間的區別，那麼const呢？事實證明，const與let幾乎完全相同。但是唯一的區別是，一旦使用const為變數賦值，就無法將其重新賦值給新值。###

let name = &#39;Tyler&#39;
const handle = &#39;tylermcginnis&#39;
name = &#39;Tyler McGinnis&#39; //正确
handle = &#39;@tylermcginnis&#39; //错误

登入後複製

###從上面的內容可以看出用let宣告的變數可以重新賦值，但用const宣告的變數不能。所以只要你想要一個變數是不可變的，你可以用const宣告它。但是用const宣告變數並不意味著它是不可變的，只是無法重新賦值，例：###

const person = {
  name: &#39;Kim Kardashian&#39;
  }
person.name = &#39;Kim Kardashian West&#39; // 正确
person = {} // 错误

登入後複製

###因此即使使用const聲明對象，也不意味著不能改變其任何屬性。它只表示無法將其重新分配給新值######總結：以上就是本篇文章的全部內容了，希望對大家有所幫助。# #####

以上是JavaScript中var，let與const之間有什麼區別的詳細內容。更多資訊請關注PHP中文網其他相關文章！