es6入門筆記

常量const

const a = 1;
a +=2;
console.log(a);
//報錯  VM6833:2 Uncaught TypeError: Assignment to constant variable.
//常量只讀，不能夠更改

列表項目

es5/es6做用域

舉個栗子：

//es5


(function(){
    var arr = [];
    for(var i =0;i<=2;i++){
        arr[i]=function(){
            return i+1;
        }
    }
    arr[0]();//4,i並無進入循環，而是在循環完，i++到i=3;
    arr[1]();//4 一個閉包的存在，當執行arr[2]()時，i已是3
 })()
--------
//es6
{
    let arr = [];
    for(let i = 0;i<=2;i++){
        arr[i] = ()=>i+1;
    }
    arr[0]();//1
    arr[1]();//2
}

總結： es5要經過當即執行函數對做用域進行隔離，es6只須要{}便可這樣就不會污染全局變量，能夠屢次使用一樣的變量

let變量聲明

{
 let a = 1;
}
console.log(a);//報錯 a is not defined

---

//不要在聲明以前使用，在語法上，稱爲「暫時性死區」（temporal dead zone，簡稱 TDZ）。
var tmp = 123;
if (true) {
  tmp = 'abc'; // ReferenceError
  let tmp;
}

---

批量聲明

{
 let [a,b,c]=[1,2,3];
 console.log(typeof a);//number
}

---

循環

for in&&for of
var arr=[1,3,4]
for(var i in arr){
console.log(i);
}
//0,1,2

for(var i of arr){
//1,3,4;
}

箭頭函數

es5:

(function(i){
   i+=1;
   console.log(i);
})(1)   //2

es6:

((i)=>{
    i+=1;
    console.log(i);
})(1)   //2

es6中function能夠省略，若是括號裏只有返回的表達式，那麼花括號和return關鍵字也能夠省略。

箭頭函數this指向：

//es5
{
    var factory = function(){
        this.a = 'a';
        this.b = 'b';
        this.c = {
            a:'a+',
            b:function(){
                return this.a;
            } 
        }
    }
    console.log(new factory().c.b())//a+
}

 //es6
{
    var factory = function(){
        this.a = 'a';
        this.b = 'b';
        this.c = {
            a:'a+',
            b:()=>this.a
            
        }
    }
    console.log(new factory().c.b())//a
}

es5實例的this指向是該函數被調用的指向（該函數是被哪一個對象所調用時的就是this）

箭頭函數中的this指向是定義時的指向（new factory()實例的指向）