ES6學習--搭建環境

ECMAScript 6（以下簡稱ES6）是JavaScript語言的下一代標準，已經在2015年6月正式發布了。它的目標，是使得JavaScript語言可以用來編寫復雜的大型應用程序，成為企業級開發語言。

學習ES6之前，我們可以先來看一下各大瀏覽器的最新版本對ES6的支持， 點擊這里

我們可以使用以下幾種環境去學習ES6

使用最新版本的Chrome或者Chromium

來說一下在Ubuntu下，如何升級到最新的Chromium，需要執行如下命令即可。

sudo add-apt-repository ppa:chromium-daily 
sudo apt-get update 
sudo apt-get install chromium-browser

然后需要開啟對ES6的支持，訪問chrome://flags/#enable-javascript-harmony頁面，開啟這個特性。

然后你就可以在Chromium的console中使用ES6了。

使用Node.js

建議更新到Node的最新版本，或者最新的穩定版本，這樣Node對ES6的支持可能會多一些。

升級Node可以使用 nvm 或者 n 等版本管理工具。

我使用的是n，命令入下：

// 全局安裝n
sudo npm install -g n
// 安裝制定版本
n 5.6.0
// 安裝最新的版本
n latest
// 安裝穩定版本
n stable
// 刪除某個版本
n rm 5.6.0
// 以指定的版本來執行腳本
n use 5.6.0 some.js

我安裝了穩定版本，當前是5.6.0

可以使用如下命令查看當前版本的Node對ES6的支持

node --v8-options | grep harmony

使用的時候只需要帶上--harmony參數

node --harmony
node --harmony test.js

使用Babel

Babel 是一個廣泛使用的ES6轉碼器，可以將ES6代碼轉為ES5代碼，從而在現有環境執行。這意味著，你可以用ES6的方式編寫程序，又不用擔心現有環境是否支持。

如何安裝Babel我就簡單舉一個例子。以一個test項目為例。

先創建test文件夾，然后在該文件夾下執行npm init，初始化package.json文件，然后修改為如下的內容：

{
  "name": "test",
  "version": "1.0.0",
  "description": "A babel test project",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "build": "babel src -d lib"
  },
  "author": "HarrySun",
  "license": "MIT",
  "devDependencies": {
    "babel-cli": "^6.6.4",
    "babel-preset-es2015": "^6.6.0"
  }
}

其中scripts中的build命令，是指將src下的文件夾里的es6的js文件轉化成es5的js文件。

然后執行一下npm install，安裝babel-cli和babel-preset-es2015包。

最后創建一下.babelrc配置文件，命令如下：

echo '{ "presets": ["es2015"] }' > .babelrc

這個項目的例子， 請點擊這里

給一個官網地址，大家可以根據不同的環境就自己的需求選擇。 Babel Setup