JavaScript ES6 重點紀錄系列 總集

這個系列是為了可以成為更好的前端工程師，所需要有的 JavaScript 技能，我把這些研究的重點都記錄下來了。

ES6 從推出到現在已經過蠻久了，應用上也很成熟了，在許多 JS 前端或後端框架上都能普遍看到它的身影。將來寫 JS 不管是前端還是後端，ES6 這些新特性真的是必備的技能了，所以事先好好地深入學習是必要的。

先來看看什麼是 JavaScript ES6

ES6 的完整名稱為 ECMAScript 6 ，這是 JavaScript 語言新一代的標準規範，在 2015 年 6 月正式發佈。

ES6 其實是一個泛指的名詞，泛指 ES5.1 版以後的新一代 JavaScript 語言標準，涵蓋了 ES2015, ES2016, ES2017 等等，ECMAScript 2015 (簡稱 ES2015) 則是正式名稱，特別算是該年度發佈的語言標準，也就是 ES6 語言標準。

ES6 提出了許多新的語法與特性，甚至擴充更多 API 可以更容易使用，使得 JavaScript 變得更強大，更適合用來寫大型或複雜的應用程式！

重點記錄 - 系列目錄

語法的新特性

• ES6 宣告方式 let、const
• ES6 解構賦值 Destructuring Assignment
• ES6 取值迴圈 for…of
• ES6 樣板文字串 Template literals
• ES6 擴展運算子 Spread Operator
• ES6 函數中的預設參數 & Rest 參數
• ES6 箭頭函數 Arrow Function
• ES6 物件語法糖的擴展

新的 API 語法

• ES6 class 類別語法
• ES6 Symbol 資料類型
• ES6 Map 物件
• ES6 Module System 模組系統
• ES6 其他的 API 與特性擴展

工具篇

• ES6 開發環境建置(上) - Babel 編譯工具
• ES6 開發環境建置(下) - ESLint 偵錯工具

其他實用網站記錄

以下都是我在研究學習期間所收集的實用網站，有些內容真的很不錯，都可以點點看 :

• 線上網頁程式碼預覽 & 編輯 (支援 ES6)

  • CodePen
  • JS - Bin
  • JSFiddle
  • Plunker

• 瀏覽器支援度查尋工具

  • ECMAScript6 compatibility table
  • Can I use… Support tables

• 其他實用工具

  • ECMAScript 6 — New Features: Overview & Comparison
  • Babel · The compiler for writing next generation JavaScript

• 文章參考資源

  • Javascript 開發者必須知道的 10 個新功能
  • ECMAScript 6 入門
  • 從ES6開始的JavaScript學習生活
  • ES6 in Depth
  • JavaScript ES6 介紹 - JavaScript (JS) 教學 Tutorial
  • JavaScript Developer Survey Results

後記

其實在研究這些內容期間都斷斷續續的，所以拖了這麼久才完成它，有些網站又寫得非常棒，很不想再重複寫一次阿，但還是自己整理記錄一次，以後想回頭瞭解也比較有方向吧！

當然在 ES6 中還有蠻多東西可以介紹的，甚至是 ES7 新的 API 語法 async函數 & await，這基本上能夠代替 ES6 的 Promise 物件來處理 JavaScript 非同步事件了，新的事物一直發展出來真的很厲害，學習的道路還要繼續不斷地往前走。

雖然寫文章真的蠻累的，至少一路走來，檢視到自己的成長與努力是值得的。