ES6 基礎知識

let:用來定義變量
特色：只能在代碼塊裏面使用,let擁有塊級做用域;而且let不容許重複聲明; 好比:

var a = 12; 
var a = 5; 
alert(a); //5;
let a = 12;
let a = 5; 
alert(a); //報錯;Identifier 'a' has already been declared 

代碼塊:{}包
起來的代碼,造成了一個做用域,好比if,for,while,json除外;塊級做用域; var 只有函數做用域;

用處: 自執行函數:

for(let i = 0; i < aBtn.length; i++){ 
    aBtn[i].onclick = function{ 
         alert(i); //0,1,2
    } 
} 

*** 塊級做用域其實就是匿名函數自執行;
const:通常用來定義常量
常量:不容許修改;有些時候定的變量不但願被改變,這個不但願被改變的值就是常量;好比:

let a = 5; 
a = 12; 
alert(a); //12;

其實但願a的值是5,可是下面有相同的變量名字覆蓋了let a的值;這個時候就要用到const;

const一旦被賦值,之後再也沒法修改,好比:

const a = 12; 
a = 5; 
alert(a); //Assignment to constant variable.

const必須給初始值,好比:

const a; 
a = 12; 
alert(a); //Missing initializer in const 

declaration; 正確的寫法:

const a = 12;

由於const定義的變量之後再也無法賦值了;
const不能重複聲明,好比:

const a = 12; 
const a = 5; 
alert(a); //Identifier 'a' has already been declared;  

用途：防止意外修改變量;

關於字符串鏈接
以前定義字符串: var str = '';或者 var str = ""; ES6定義字符串:

var str1 = 'elcome'; 
var str2 = 'w';

ES6鏈接字符串:${變量名}

var str3 = '${str2}${str1}';  //輸出:welcome；

解構賦值
ES6以前：

var a = 12;
var b = 5; 
var c = 10; 
alert(a);  //12

ES6:

var [a,b,c] = [12,5,10]; //數組的形式定義;
alert(a); //訪問某一項 
console.log(a); //打印出所有的值;
var {a,b,c} = {
    a: 12,
    b: 5,
    c: 10
}; //json的形式定義;跟順序無關;
alert(a); //訪問某一項; 
console.log(a,b,c); //打印出所有的值;

使用ES6定義的時候注意模式匹配:
模式匹配：左邊的樣子和右邊的同樣;

var [a,[b,c],d] = [1,[3,4],5]; 
console.log(a,b,c,d);

解構賦值默認值的寫法:

var {time=12,id=321} = {};
console.log(time,id);//這裏的time和id都是默認值;

由於等號右邊沒有賦值;因此須要給默認值,若是不給默認值的的話是undefined;

Array.from:複製一個數組

var arr = [1,2,3,4];
var arr2 = Array.from(arr);
arr2.pop; //刪除arr2 中的某一項不會影響到arr; 
console.log(arr,arr2);

快速複製一個數組: ···
實例1:

var arr = [1,2,3,4];
var arr2 = [...arr1]; //引用arr1裏面的內容;
arr2.pop;
console.log(arr2); 

實例2:

function show(...args){ 
    console.log(args); //1,2,3,4;這裏的值也就是arguments的每個; 
    args.push(5); //往arguments裏面添加一個; 
    console.log(args);//往arguments裏面添加一個5,這在ES6以前是不容許的; 
}
show(1,2,3,4);

新增循環 for of
for of 用來遍歷(迭代/循環)整個對象;表現相似於for in;

var arr = ['banana','pear','orange','apple'];
for(var i in arr){ //i是索引; 
    console.log(i); //0,1,2,3,索引;
 }
for(var i of arr){ //i是值; 
    console.log(i); //banana,pear,orange,apple;
}

for of 循環不能用來循環json,能夠循環數組,for of的真正目的是爲了循環map對象;實例以下:

var json = { 'a':'12', 'b':'11', 'c':'10', };
for(var name of json){ 
    console.log(name); //json[Symbol.iterator] is not a function(…)
} 

for of 也能夠循環數組: 只循環值:

for(var name of arr){
    console.log (name)
};

只循環索引:

for(var name of arr.keys){ 
    console.log(name) 
}; 

索引和值都循環:

for(var name of arr.entries){ 
    console.log(name)
};

Map對象
和json類似,也是鍵值對的形式 key-value;Map對象主要是爲了和for of循環配合而生。 怎麼獲得一個Map對象:

var oMap = new Map;

設置:

oMap.set (name,value);
oMap.set(name,value); //給Map對象設置值;
oMap.set ('a','banana');
oMap.set('b','pear');
console.log(oMap); //{"a" => "banana", "b" => "pear"}

獲取:

oMap.get(name);
oMap.get ('a'); //banana;

刪除:

oMap.delete(name);
oMap.delete('a');

循環Map用 for of:

var oMap = new Map;
oMap.set('a','banana');
oMap.set ('b','pear');
oMap.set('c','orange');
oMap.set('d','apple');
for(var name of oMap){ ==>此種寫法的本質就是循環了oMap.entries;
    console.log (name);//結果中不只有name,還有value; a,banana b,pear,c,orange d,apple 
}

==>此種寫法等價於:

for(var name in oMap.entries){ 
    console.log(name);
}

 //以key-value的形式取值:

for(var [key,value] of oMap){
    console.log(key+':'+vlaue); //a:banana b:pear c:orange d:apple 
}

只循環key

for(var key of oMap.keys){ 
    console.log(key); //a,b,c,d 
} 

只循環value

for(var val of oMap.values){ 
    console.log (val); //banana,pear,orange,apple 
}

箭頭函數
ES6以前：

function show(a, b, c){ 
    return a + b + c 
}

ES6:

=> 注意: 箭頭函數裏面的this指的是window; 在箭頭函數中arguments不能使用了;

ES6:給默認值

var move==>{
    console.log(obj); //undefined;
    //由於obj未傳參;有些時候不但願有undefined;這個時候須要給一個默認值;
}
move;
var move=(obj='參數必須傳遞') => {
    console.log(obj); //參數必須傳遞;
}