JavaScript ES6新增語法

一、宣告關鍵字

Let：

1. 基礎功能與var一樣
2. 全域變數不會系結到window物件
3. 沒有提升
4. 不允許重復宣告
5. 塊級作用域（只要是花括號就是作用域）
6. 暫時性死區（宣告之前不允許使用）

const：

1. 功能與let一致
2. const宣告的是常量，宣告時候立即賦值，之后不能再修改（const不允許修改地址，但可以改值）
3. 一般宣告一次再不回改變的變數使用const

二、解構賦值

1. 陣列的解構賦值（從左到右順序，依次解構，變數多了就為undefined）

	let arr = [3,4,5,6];
    let age = arr[0];
    let sex = arr[1];
    let num = arr[2];
    let abc = arr[3];
    let qwe = arr[4];
    let [sex,age,num,abc,qwe] = arr;

	console.log(age)
    console.log(sex)
    console.log(num)
    console.log(abc)
    console.log(qwe)  //undefined

2. 字符的解構賦值（從左到右的順序，依次解構，變數多了就為undifined）

    var str = "hello world";
    var [a,b,c,d,e,f,g] = str;
    
	console.log(a)
    console.log(b)
    console.log(c)
    console.log(d)
    console.log(e)

3. 物件的解構賦值（按照鍵名一一對應，不存在的鍵名為undefined）

 var obj = {
        name:"admin",
        sex:1,
        age:18
    }
 var name = obj.name
 var {sex,age,name} = obj;

 console.log(name)
 console.log(age)
 console.log(sex)

4. 解構賦值一般用于函式的傳參和函式回傳值

function fn([a,b,c,d,e]){}
    var arr = [2,3,4,5,6]
    fn(arr)

    function fn(){
        return {
            year:2020,month:12,date:31
        }
    }
    var {tear,month,date} = fn()

快速交換兩個變數的值

 	var a = 10;
    var b = 20;
    var [a,b] = [b,a]

    console.log(a)
    console.log(b)

三、字符的方法

1. 新的字符方法

	var str = "hello";
    console.log(str.repeat(5));
    console.log(str.includes("a"));
    console.log(str.startsWith("e"));
    console.log(str.endsWith("o"));

2. 字符轉編碼：str.codePointAt()
3. 編碼轉字符：String.formCodePoint()
4. 新增字串模版（字串的拼接方式）

  var s1 = "這是字符" + "這是拼接的字符";
    var s2 = `這
    也
    是
    字
    符
    ${ s1 }`;
    console.log(s1);
    console.log(s2);

四、箭頭函式（()=>{}）

特點：

• 不能直接存在，必須作為值存在
• 語法極簡
• 當有且只有一個形參時，可以省略小括號
• 當有且只有回傳陳述句時，可以省略return關鍵字和花括號
• 傷害了代碼的可讀性
• 當有且只有回傳陳述句，回傳的是物件時，要么不能省略花括號和return，要么將物件使用小括號包裹起來
• 箭頭函式沒有自己的this，內部的this回自動使用外層this
• 箭頭函式不能被new執行

使用場景：

1. 回呼函式
2. 回傳值
3. 小范圍使用

  var f = ()=>{
        console.log(1);
    }
    f();

    var fn = a=>{
        console.log(a)
    }
    fn("hello")

    var fn = a=>"hello " + a;

    console.log(typeof fn);

五、展開運算子（...）

類似與解構賦值，展開復雜資料（陣列和物件）

• 取陣列最大值最小值

 	var arr = [34,56,87,25,69]; 
    console.log(Math.max(...arr));

	var arr = [34,56,87,25,69]; 
    ES6中取陣列的最大或最小值
    console.log(Math.max(...arr));

	 var obj = {
        name:"admin"
    }
    var people = {
        age:18,
        sex:1,
        ...obj
    }
    console.log(people)


    var obj = {
        name:"admin"
    }
    var obj2 = {...obj}
    obj2.name = "root";
    console.log(obj)
    console.log(obj2)
    console.log(...obj)
    console.log(name:"admin")

六、symbol資料型別

• 一種新的資料型別，特點類似于字符
• 一旦被創建，不可更改不與任何資料相同，自身相等，用來做標記量（字典量）
• 使用在固定的不可被改變的標記量

 	var s1 = Symbol();
    var s2 = Symbol();
    console.log(s1);
    console.log(s2);
    console.log(typeof s2);
    console.log(s1 === s1);
    console.log(s1 === s2);

七、set和map

set：
重復的引數，不會添加，型別為物件，沒有索引號和字符長度
使用for - of遍歷；s.siez查看長度（可用于陣列去重）

var s = new Set([4,5,2,1]);
    s.add("hello")
    s.add(4)
    s.add("4")
    console.log(s);
    console.log(typeof s);
    console.log(s[0])
    console.log(s.length)
    for(var i of s){
        console.log(i);
    }
    console.log(s.size)

Array.from(set([3,3,2,4,5])) //一行代碼實作陣列去重

map：
set(“鍵”，值)，物件添加屬性的方法

• 添加的屬性鍵值為：鍵=>值連接
• 型別為物件，size查看字符長度
• get(“鍵”)獲取屬性值
• 使用for-of遍歷

    var m = new Map();

    m.set("name","admin");
    m.set("age",18);
    m.set("sex",1);
    m.set("show",function(){});

    console.log(m)
    console.log(typeof m)

    console.log(m.size)

    console.log(m[0])
    console.log(m.length)

    console.log(m.get("name"))
    console.log(m.get("sex"))
    console.log(m.get("age"))

    for(var i of m){
        console.log(i)
    }