let與const怎么在ES6中使用

本篇文章為大家展示了let與const怎么在ES6中使用，內(nèi)容簡明扼要并且容易理解，絕對能使你眼前一亮，通過這篇文章的詳細(xì)介紹希望你能有所收獲。

成都創(chuàng)新互聯(lián)公司成都網(wǎng)站建設(shè)按需求定制網(wǎng)站，是成都網(wǎng)站營銷公司,為成都被動防護(hù)網(wǎng)提供網(wǎng)站建設(shè)服務(wù),有成熟的網(wǎng)站定制合作流程，提供網(wǎng)站定制設(shè)計(jì)服務(wù)：原型圖制作、網(wǎng)站創(chuàng)意設(shè)計(jì)、前端HTML5制作、后臺程序開發(fā)等。成都網(wǎng)站建設(shè)熱線：13518219792

在ES6中不是var，而是通過let來聲明變量，用const來聲明常量，有如下一些不同：

1、let與const作用域只限于當(dāng)前代碼塊{}，而var則沒有這種限制。

2、使用let、const申明的變量作用域不會被提升。例如：

console.log(str);
var str="var declare";

控制臺輸出undefined；因?yàn)樽兞可昝魇窃谌我獯a執(zhí)行前處理的，在代碼區(qū)中任意地方聲明變量和在最開始（最上面）的地方聲明是一樣的。也就是說，看起來一個(gè)變量可以在聲明之前被使用！這種行為就是所謂的“hoisting”，也就是變量提升，看起來就像變量的聲明被自動移動到了函數(shù)或全局代碼的最頂上。注意：僅僅是聲明提升了，定義并不會被提升。因此console.log()可以檢測到str的聲明，但是卻沒有定義，提示undefined。

console.log(str2);
let str2="let declare";

控制臺報(bào)錯：can't access lexical declaration `str2' before initialization，let不會把聲明提升到全局之前，因此在console輸出str2時(shí)會報(bào)錯未聲明。

3、在相同的作用域下不能申明相同的變量，利用var可以聲明兩次同一個(gè)變量，并且后一個(gè)會覆蓋前面的聲明，而let、const不可以。

4、for循環(huán)體現(xiàn)let的父子作用域

var btns=document.querySelectorAll('button');
for (var i=0;i<btns.length;i++){
  btns[i].οnclick=function () {
    alert("第"+i+"個(gè)按鈕");
  }
}

由于var會提升作用域，當(dāng)btns[i]在本代碼塊{}找不到i時(shí)，會找到之前的for中的i。在函數(shù)循環(huán)執(zhí)行時(shí)，并沒有觸發(fā)onclick，i一直++到5。當(dāng)任意按鈕點(diǎn)擊的時(shí)侯觸發(fā)onclick，此時(shí)i==5，因此無論按那個(gè)按鈕都會顯示“第5個(gè)按鈕”。

解決方法一：閉包處理      

var btns=document.querySelectorAll('button');
for (var i=0;i<btns.length;i++){
  (function (i) {//通過參數(shù)傳遞i，在另一個(gè)函數(shù)內(nèi)的i
    btns[i++].οnclick=function () {
      alert("第"+i+"個(gè)按鈕");
    }
  })(i);
}

閉包處理：閉包就是一個(gè)函數(shù)引用另外一個(gè)函數(shù)的變量，因?yàn)樽兞勘灰弥圆粫换厥?，因此可以用來封裝一個(gè)私有變量,i是另一個(gè)函數(shù)作用域內(nèi)的變量，不會隨著外循環(huán)而改變。

方法二：使用let的情況下，會自己區(qū)分為兩個(gè)作用域，每個(gè)btns[i]內(nèi)的函數(shù)對應(yīng)不同的變量i

for (let i=0;i<btns.length;i++){//內(nèi)部為新的let作用域
  btns[i].οnclick=function (){
    alert("第"+i+"個(gè)按鈕");
  }
}

上述內(nèi)容就是let與const怎么在ES6中使用，你們學(xué)到知識或技能了嗎？如果還想學(xué)到更多技能或者豐富自己的知識儲備，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。

網(wǎng)頁名稱：let與const怎么在ES6中使用
網(wǎng)頁路徑：http://bm7419.com/article40/jdohho.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供定制開發(fā)、企業(yè)網(wǎng)站制作、網(wǎng)站制作、關(guān)鍵詞優(yōu)化、網(wǎng)站排名、小程序開發(fā)

廣告

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