這幾天在學(xué)習(xí)vue，會(huì)發(fā)現(xiàn)現(xiàn)在的框架都需要有一定的es6基礎(chǔ)，所以也快速的了解了一下es6語(yǔ)法的新特性，看的不多，只能簡(jiǎn)單的分享一下。

1.聲明變量 let const

• let的三個(gè)特性
  1.不允許重復(fù)聲明
  2.不存在變量提升
  3.塊級(jí)作用域 暫時(shí)性死區(qū)

  let num = 1;
  let num = 2;
  console.log(num)
//此時(shí)會(huì)報(bào)錯(cuò)
//Uncaught SyntaxError: Identifier 'num' has already been declared

console.log(name)
let name = "xiaoming"
//此時(shí)也會(huì)報(bào)錯(cuò)
//Uncaught ReferenceError: num is not defined

if(false){
  let per = 1;
}
console.log(per)
//此時(shí)會(huì)報(bào)錯(cuò)
// Uncaught ReferenceError: per is not defined

• const的特性跟let相同，同時(shí)它還有一個(gè)特性：

  聲明一個(gè)只讀的常量，一旦聲明，常量的值就不能更改

需要注意

var 聲明的變量是由函數(shù)來(lái)劃分作用域的
let 聲明的變量是由代碼塊劃分作用域的（塊級(jí)作用域）

2.解構(gòu)賦值

ES6允許按照一定的模式，從數(shù)組和對(duì)象中提取值，對(duì)變量進(jìn)行賦值，這就被稱之為解構(gòu)賦值

• 數(shù)組的解構(gòu)賦值

  let [a,b] = [1,2]
  let[c,d,e=5] = [3,4]

  //此時(shí)a,b,c,d,e 的值分別對(duì)應(yīng)1,2,3,4,5

• 對(duì)象的解構(gòu)賦值

 let{name,age} = {name:"小明",age:23}

//此時(shí)變量name的值為“小明” ，變量age的值為23

• 函數(shù)參數(shù)的解構(gòu)賦值

function fn({a,b,c}){
  console.log(a)
  console.log(b)
  console.log(c)
}

fn({
  a:1,
  b:2,
  c:3
})

3.模板字符串

以前開(kāi)發(fā)的時(shí)候經(jīng)常會(huì)運(yùn)用到字符串拼接，拼接起來(lái)很麻煩而且容易出錯(cuò)，例如：

 var str =  '<div class="record">' +
              '<div class="header clearfix">'+
                '<span class="fl"></span>'+
                '<h3 class="fl">備案信息</h3>'+
              '</div>'+
             '</div>'

//這是常規(guī)的字符串拼接 容易出錯(cuò)

ES6提供了模板字符串，這是一種增強(qiáng)的字符串，用反引號(hào) （`）來(lái)標(biāo)識(shí)。

`<div class="record">
        <div class="header clearfix">
            <span class="fl"></span>
            <h3 class="fl">備案信息</h3>
        </div>
</div>`
//只需要用反引號(hào)  ` 將需要拼接的字符串包裹起來(lái)就可以了

同時(shí)可以在占位符${}中直接寫入表達(dá)式以及變量

   var name = "xiaoming"; 
   var str = `helloWorld ${name}`
   console.log(str)
  //helloWorld  xiaoming

4.箭頭函數(shù)

ES6中提供了箭頭函數(shù)，使用( => )來(lái)定義函數(shù)

var f = (a,b) = > a + b
console.log(f(1,2))
//打印出來(lái)的是3

箭頭函數(shù)不用手動(dòng)提取返回值，箭頭函數(shù)會(huì)自動(dòng)返回 返回值

 document.onclick = function () { 
           setTimeout(function () {
                console.log(this)
             },1000)
         }
//此時(shí) 點(diǎn)擊事件觸發(fā)時(shí)，一秒鐘以后會(huì)打印window對(duì)象

document.onclick = function(){
        setTimeout(() => {
            console.log(this)
        },1000)
    }
//用箭頭函數(shù)  此時(shí)打印出來(lái)的是document對(duì)象

上面兩個(gè)例子表明：用箭頭函數(shù)定義的函數(shù)，函數(shù)內(nèi)this是在定義時(shí)就已經(jīng)確定了指向，而正常定義的函數(shù)，函數(shù)內(nèi)this是在調(diào)用的時(shí)候才能確定this指向

5.promise對(duì)象

Promise 是異步編程的一種解決方案，比傳統(tǒng)的解決方案——回調(diào)函數(shù)和事件更合理和更強(qiáng)大。
Primise對(duì)象有兩個(gè)特性：

• 對(duì)象的狀態(tài)不受外界影響。Promise對(duì)象代表一個(gè)異步操作，有三種狀態(tài)：pending（進(jìn)行中）、fulfilled（已成功）和rejected（已失?。Ｖ挥挟惒讲僮鞯慕Y(jié)果，可以決定當(dāng)前是哪一種狀態(tài)，任何其他操作都無(wú)法改變這個(gè)狀態(tài)。
• 一旦狀態(tài)改變，就不會(huì)再變，任何時(shí)候都可以得到這個(gè)結(jié)果。

ES6 規(guī)定，Promise對(duì)象是一個(gè)構(gòu)造函數(shù)，用來(lái)生成Promise實(shí)例。

const promise = new Promise(function(resolve, reject) {
  // ... some code

  if (/* 異步操作成功 */){
    resolve(value);
  } else {
    reject(error);
  }
});

resolve函數(shù)的作用是，將Promise對(duì)象的狀態(tài)從“未完成”變?yōu)椤俺晒Α保磸?pending 變?yōu)?resolved），在異步操作成功時(shí)調(diào)用，并將異步操作的結(jié)果，作為參數(shù)傳遞出去；reject函數(shù)的作用是，將Promise對(duì)象的狀態(tài)從“未完成”變?yōu)椤笆　保磸?pending 變?yōu)?rejected），在異步操作失敗時(shí)調(diào)用，并將異步操作報(bào)出的錯(cuò)誤，作為參數(shù)傳遞出去。
Promise實(shí)例生成以后，可以用then方法分別指定resolved狀態(tài)和rejected狀態(tài)的回調(diào)函數(shù)。