# Javascript 第八章 ES6 ###### tags: `JS X Codeshiba` ## ES6的特性 **範例一: for迴圈** 使用前: 用原有迴圈的結構,變數容易在外面汙染其他變數或被汙染 ![](https://i.imgur.com/ZBRRxBI.png) 使用後: 變數不影響後續迴圈的結構了!! ![](https://i.imgur.com/IZQllHw.png) 原因: 原有var的作用域需要用function來區分,變成let只需要用大括號來區分 **範例二: if...else結構** 使用前: 用var,最後的console.log就直接把變數印出來了 ![](https://i.imgur.com/Dk20ZHn.png) 使用後: 值並未覆寫,仍是原有宣告的變數 ![](https://i.imgur.com/tm0dVxb.png) **範例三: IIEF 立即函式** ![](https://i.imgur.com/vFqxhUB.png) ## 常數(const) 首先,訂出來的常數不可以隨意改變 ![](https://i.imgur.com/Bj5M6HD.png) 但是當常數拿來定義物件時,裡面的值是可以變的 ![](https://i.imgur.com/skBaYsn.png) 連屬性都可以增加 ![](https://i.imgur.com/bJ7DC57.png) ## 用let來解構賦值 用let宣告過後就不能再次宣告 ![](https://i.imgur.com/w1fDhit.png) 用let就可以以陣列的形式來宣告值,就不用重複宣告 ![](https://i.imgur.com/iLitfHO.png) 用let值也可以以物件的形式來宣告 ![](https://i.imgur.com/tV90X7R.png) ```Explaination {a,b}其實是 {a=a,b=b}的縮寫 ``` ## For in & For of [MDN_For of](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of) [MDN_For in](https://developer.mozilla.org/zh-TW/docs/Web/JavaScript/Reference/Statements/for...in) ## iterator 迭代器 請參考: [MDN 迭代協議](https://developer.mozilla.org/zh-TW/docs/Web/JavaScript/Reference/Iteration_protocols) ![](https://i.imgur.com/oYLieRc.png) ![](https://i.imgur.com/owmGJ2R.png) ## for of 的用法 ![](https://i.imgur.com/k0zrvWn.png) ![](https://i.imgur.com/l7pz43D.png) ## 樣板字面值 ![](https://i.imgur.com/siumFFM.png) ## 擴展運算子 讓陣列可以直接用console.log表達出來 ![](https://i.imgur.com/WWWTeUi.png) 讓陣列可以被用來做相關運算 ![](https://i.imgur.com/jE3Ed9D.png) 讓陣列可以連結起來 ![](https://i.imgur.com/6KiR9dl.png) 也可以使用在物件上,並會取代掉原有的屬性 ![](https://i.imgur.com/fXJKpkC.png) ## 箭頭函式 [參考文章 箭頭函式MDN](https://developer.mozilla.org/zh-TW/docs/Web/JavaScript/Reference/Functions/Arrow_functions) ![](https://i.imgur.com/t3xaGUs.png) ## Call & This ![](https://i.imgur.com/zAyRamK.png)