5分鐘掌握var,let和const異同-創(chuàng)新互聯(lián)

轉載請注明出處:葡萄城官網,葡萄城為開發(fā)者提供專業(yè)的開發(fā)工具、解決方案和服務,賦能開發(fā)者。
原文出處:https://dzone.com/articles/javascript-difference-between-var-let-and-const-ke

創(chuàng)新互聯(lián)建站總部坐落于成都市區(qū),致力網站建設服務有成都網站建設、做網站、網絡營銷策劃、網頁設計、網站維護、公眾號搭建、小程序制作、軟件開發(fā)等為企業(yè)提供一整套的信息化建設解決方案。創(chuàng)造真正意義上的網站建設,為互聯(lián)網品牌在互動行銷領域創(chuàng)造價值而不懈努力!

這個話題對于一些老鳥來說可能根本算不上疑問,但對于新手來說也許除了最常見的var之外,let和const較少使用的機會。

所以在本文中,我將會通過一些例子來為大家介紹如何在Javascript中靈活使用var、let和const這些關鍵字來定義變量,以及這些關鍵字它們之間有什么異同。

如果你懶得看下面的代碼,那我可以先把概念結論說出:

  • var定義的變量可被更改,如果不初始化而直接使用也不會報錯

  • let定義的變量和var類似,但作用域在當前聲明的范圍內

  • const定義的變量只可初始化一次且作用域內不可被更改,使用前必須初始化

下面我將通過示例的形式來詳細為大家介紹它們三者之間的異同:

Var

var用以聲明一個變量,并且同時我們可以在聲明語句中初始化所聲明的變量。

例如:

var a = 10;
  • 變量的聲明,會在代碼被執(zhí)行之前被處理。

  • var聲明的JavaScript變量,其可用范圍在當前執(zhí)行上下文。

  • 在函數(shù)外聲明的JavaScript變量,其作用范圍是全局。

考慮以下代碼片段:

5分鐘掌握var,let和const異同

function nodeSimplified() {
  var a =10;
  console.log(a);  // 輸出 10
  if(true) {
   var a=20;
   console.log(a); // 輸出 20
  }
  console.log(a);  // 輸出 20
}

5分鐘掌握var,let和const異同

在上面的代碼中,你可以發(fā)現(xiàn),當變量a在if代碼段里被更新時,它的值被全局更新了,因此在經過了if代碼后,被更新的值仍然被保留著。這與其他語言中的全局變量有點類似。但是,在使用這個功能時要非常小心,因為它有可能會覆蓋一個已有的值。

let

let語句在一個塊級范圍里聲明一個局部變量。和var類似,我們可以在聲明時初始化它的值。

例如:

let a = 10;
  • 這個語句允許你創(chuàng)建一個變量,使它的作用范圍被限制在它所在的代碼塊。

  • 它和Java、C#等其他語言的變量類似。

考慮下面的代碼片段:

5分鐘掌握var,let和const異同

function nodeSimplified() {
  let a =10;
  console.log(a);  // output 10
  if(true) {
   let a=20;
   console.log(a); // output 20
  }
  console.log(a);  // output 10
}

5分鐘掌握var,let和const異同

它和大多數(shù)語言中我們所見的表現(xiàn)行為是一致的。

function nodeSimplified() {
  let a =10;
  let a =20; // 拋出語法錯誤
  console.log(a); 
}

錯誤信息:"未捕獲的異常:標識符'a'已經被聲明過。" 但如果使用var就沒事:

function nodeSimplified() { 
  var a =10;   
  var a =20;   
  console.log(a);  // 輸出 20 
}

使用let語句,可以很好的維護變量的作用范圍。當使用內部函數(shù)時,let語句讓你的代碼更整潔。

我希望上面的例子能幫你更好地理解varlet。如果有任何疑問,請在評論區(qū)留言。

const

const語言中的變量只能被賦值一次,然后就不能在被賦值。const語句的作用范圍和let語句一樣。

例如:

const a = 10;
function nodeSimplified() {
  const MY_VARIABLE =10;
  console.log(MY_VARIABLE);  // 輸出 10 
}

照例,命名規(guī)范指出我們應該用大寫字母聲明常量。當然,const a = 10 在上面的代碼中會的起到相同的作用。為了讓代碼長期可維護,命名規(guī)范還是值得遵守的。

問題:如果給一個const變量重新賦值會發(fā)生什么? 考慮下面的代碼:

5分鐘掌握var,let和const異同

function nodeSimplified() {
  const MY_VARIABLE =10;
  console.log(MY_VARIABLE);  // 輸出 10
  MY_VARIABLE =20;           // 拋出類型錯誤
  console.log(MY_VARIABLE); 
}

5分鐘掌握var,let和const異同

錯誤信息:"未捕獲的類型錯誤:給const變量賦值"。

當我們嘗試給已有的const變量賦值時,這段代碼會拋出一個錯誤。

介紹就到此結束,希望這篇短小精悍的文章能夠幫助到各位更好的理解在Javascript中聲明變量時使用不同關鍵字上到底有何異同。


本文是由葡萄城技術開發(fā)團隊發(fā)布,轉載請注明出處:葡萄城官網

了解開放易用的 Web 生成平臺,請前往活字格Web應用生成平臺

了解可嵌入您系統(tǒng)的在線 Excel,請前往SpreadJS純前端表格控件

另外有需要云服務器可以了解下創(chuàng)新互聯(lián)scvps.cn,海內外云服務器15元起步,三天無理由+7*72小時售后在線,公司持有idc許可證,提供“云服務器、裸金屬服務器、高防服務器、香港服務器、美國服務器、虛擬主機、免備案服務器”等云主機租用服務以及企業(yè)上云的綜合解決方案,具有“安全穩(wěn)定、簡單易用、服務可用性高、性價比高”等特點與優(yōu)勢,專為企業(yè)上云打造定制,能夠滿足用戶豐富、多元化的應用場景需求。

本文標題:5分鐘掌握var,let和const異同-創(chuàng)新互聯(lián)
本文網址:http://bm7419.com/article10/ipego.html

成都網站建設公司_創(chuàng)新互聯(lián),為您提供微信小程序響應式網站、網站策劃、關鍵詞優(yōu)化、Google、網站導航

廣告

聲明:本網站發(fā)布的內容(圖片、視頻和文字)以用戶投稿、用戶轉載內容為主,如果涉及侵權請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內容未經允許不得轉載,或轉載時需注明來源: 創(chuàng)新互聯(lián)

外貿網站制作