今天開始一(yī / yì ／yí)起來(lái)了(le／liǎo)解下Es6這(zhè)個(gè)技術知識點，這(zhè)樣我們自己也(yě)可以(yǐ)總結和(hé / huò)學習，也(yě)算一(yī / yì ／yí)個(gè)好的(de)開始和(hé / huò)堅持。ECMAScript 6（以(yǐ)下簡稱ES6）是(shì)JavaScript語言的(de)下一(yī / yì ／yí)代标準。因爲(wéi / wèi)當前版本的(de)ES6是(shì)在(zài)2015年發布的(de)，所以(yǐ)又稱ECMAScript 2015。也(yě)就(jiù)是(shì)說(shuō)，ES6就(jiù)是(shì)ES2015。

雖然目前并不(bù)是(shì)所有浏覽器都能兼容ES6全部特性，但越來(lái)越多的(de)程序員在(zài)實際項目當中已經開始使用ES6了(le／liǎo)。所以(yǐ)就(jiù)算你現在(zài)不(bù)打算使用ES6，但爲(wéi / wèi)了(le／liǎo)看懂别人(rén)寫的(de)代碼你也(yě)必須要(yào / yāo)懂ES6的(de)語法了(le／liǎo)...之(zhī)前用的(de)，你所熟悉的(de)js語法是(shì)es5标準，現在(zài)是(shì)es6标準，恩就(jiù)這(zhè)麽多。

ES6 常見語法

let, const, class, extends, super, arrow functions, template string, destructuring, default, rest arguments
這(zhè)些是(shì)ES6最常用的(de)幾個(gè)語法，基本上(shàng)學會它們，我們就(jiù)可以(yǐ)走遍天下都不(bù)怕啦！我會用最通俗易懂的(de)語言和(hé / huò)例子(zǐ)來(lái)講解它們，保證一(yī / yì ／yí)看就(jiù)懂，一(yī / yì ／yí)學就(jiù)會。

但是(shì)ES6那麽多那麽多特性，我們需要(yào / yāo)全部都掌握嗎？秉着二八原則，掌握好常用的(de)，有用的(de)這(zhè)個(gè)可以(yǐ)讓我們快速掌握。今天跟蘇州網絡公司小編來(lái)學最基礎的(de) 也(yě)是(shì)最有特點的(de)  let, const

1.變量聲明 const 和(hé / huò) let

我們都是(shì)知道(dào)在(zài)ES6以(yǐ)前，var關鍵字聲明變量。無論聲明在(zài)何處，都會被視爲(wéi / wèi)聲明在(zài)函數的(de)最頂部(不(bù)在(zài)函數内即在(zài)全局作用域的(de)最頂部)。這(zhè)就(jiù)是(shì)函數變量提升例如:

  function aa() {    
  if(bool) {       
       var test = 'hello man'
   } else {       
        console.log(test)
    }
  }
以(yǐ)上(shàng)的(de)代碼實際上(shàng)是(shì)：

  function aa() {    var test // 變量提升
    if(bool) {
        test = 'hello man'
    } else {        
  
  //此處訪問test 值爲(wéi / wèi)undefined
        console.log(test)
    }    //此處訪問test 值爲(wéi / wèi)undefined
  }
所以(yǐ)不(bù)用關心bool是(shì)否爲(wéi / wèi)true or false。實際上(shàng)，無論如何test都會被創建聲明。

接下來(lái)ES6主角登場：
我們通常用let和(hé / huò)const來(lái)聲明，let表示變量、const表示常量。let和(hé / huò)const都是(shì)塊級作用域。怎麽理解這(zhè)個(gè)塊級作用域？

在(zài)一(yī / yì ／yí)個(gè)函數内部
在(zài)一(yī / yì ／yí)個(gè)代碼塊内部
說(shuō)白了(le／liǎo) {}大(dà)括号内的(de)代碼塊即爲(wéi / wèi)let 和(hé / huò) const的(de)作用域。
看以(yǐ)下代碼：

  function aa() {    
      if(bool) {      
       let test = 'hello man'
    } else {        //test 在(zài)此處訪問不(bù)到(dào)
        console.log(test)
    }
  }
let的(de)作用域是(shì)在(zài)它所在(zài)當前代碼塊，但不(bù)會被提升到(dào)當前函數的(de)最頂部。

再來(lái)說(shuō)說(shuō)const。

    const name = 'lux'
    name = 'joe' //再次賦值此時(shí)會報錯
說(shuō)一(yī / yì ／yí)道(dào)面試題

    var funcs = []    
    for (var i = 0; i < 10; i++) {
        funcs.push(function() { console.log(i) })
    }
    funcs.forEach(function(func) {
        func()
    })
這(zhè)樣的(de)面試題是(shì)大(dà)家常見，很多同學一(yī / yì ／yí)看就(jiù)知道(dào)輸出(chū) 10 十次
但是(shì)如果我們想依次輸出(chū)0到(dào)9呢？兩種解決方法。直接上(shàng)代碼。

    // ES5告訴我們可以(yǐ)利用閉包解決這(zhè)個(gè)問題
    var funcs = []    
    for (var i = 0; i < 10; i++) {
        func.push((function(value) {            
            return function() {              
            
              console.log(value)
            }
        }(i)))
    }    
    // es6
    for (let i = 0; i < 10; i++) {
        func.push(function() {           
     console.log(i)
        })
    }
達到(dào)相同的(de)效果，es6簡潔的(de)解決方案是(shì)不(bù)是(shì)更讓你心動！！！想要(yào / yāo)了(le／liǎo)解的(de)更多可以(yǐ)去莫度上(shàng)去找哦，你懂的(de)。