摘要：類總所周知，不像其他面向對象語言那樣支持類，但是可以通過函數和原型來模擬類。如果你學習過或者其他面向對象語言的話，你會覺得很熟悉。結論下一個版本的會帶來一個更加簡單更加友好的語法來幫助那些從面向對象語言轉過來的開發者的學習。

原文地址:http://www.frontendjournal.com/javascript-es6-learn-important-features-in-a-few-minutes/

　　下一個Javascript版本，也就是ECMAScript 6(ES6或者Harmony)，給我們帶來了很多令人興奮的特性。下面我們來快速看看這些特性。下面列出的這些特性是我覺得很可能會在你日常工作中用到的。
　　如果你是一個Javascript新手或者原來是做服務器端開發的，那么你也不必擔心，我相信現在是學習Javascript的最好時機，因為ES6有很多簡介并且友好的特性。

類

　　總所周知，Javascript不像其他面向對象語言那樣支持類，但是Javascript可以通過函數和原型來模擬類。
　　下面是一個創建類的新語法。如果你學習過Java或者其他面向對象語言的話，你會覺得很熟悉。

class Project {  
  constructor(name) {
    this.name = name;
  }

  start() {
    return "Project " + this.name + " starting";
  }
}

var project = new Project("Journal");  
project.start(); // "Project Journal starting"

　　所有你在類里面聲明的方法都會添加到類的原型中。
　

ES6和原型中的繼承

　　正如前面說的，Javascript不支持類。所以，既然它不支持類，那么它支持繼承嗎？
　　的確，Javascript中的繼承大部分是通過原型實現。如果你對原型不熟悉，那么一個好消息就是在ES6中你沒必要了解原型就可以使用類和繼承。原型并不難學習但是在這里你只要知道原型是javascript中實現繼承的一種方式就可以了。
　　下面我創建了一個Project的子類，命名為WebProject并且繼承Project中的屬性和方法

class WebProject extends Project {  
  constructor(name, technologies) {
    super(name);
    this.technologies = technologies;
  }

  info() {
    return this.name + " uses " + arrayToString(this.technology);
  }
}

function arrayToString(param) {  
  // ... some implementation
}

var webJournal = new WebProject("FrontEnd Journal", "javascript");  
webJournal.start(); // "FrontEnd Journal starting"  
webJournal.info(); // "FrontEnd Journal uses javascript"  

　　注意到在WebProject的構造函數中調用了Project的構造函數，然后就可以使用它的屬性和方法了。
　　

模塊

　　如果你不想把你的JS代碼都放在一個文件中或者你想在你的應用中的其他部分重用一些功能，那么你就很可能要用到模塊。你需要記住的一個變量是export，只要在你要暴露出來的方法前面加上export就可以了。
　　下面是我們應用的結構。Project類和WebProject類被放在application.js中。

myproject (folder)  
 |
 -- modules (folder)
 |   |
 |   -- helpers.js
 |
 -- application.js

　　讓我們把arrayToString()方法從application.js中分離出來然后放在modules/helpers.js模塊中，這樣我們就可以在其他地方重用它了。

// modules/helper.js
export function arrayToString(param) {  
  // some implementation
}

　　現在我們只需要在application.js中導入我們的模塊就可以了。

// application.js
import { arrayToString } from "modules/helpers";

class WebProject extends Project {  
  constructor(name, technologies) {
    super(name);
    this.technologies = technology;
  }

  info() {
    return this.name + " uses " + arrayToString(this.technology);
  }
}

// ...

ES6的其他特性

　　下面兩個ES6中的特性就比較有趣了。let和const。

let

　　為了理解let，首先我們需要記住var創建的是函數作用域的變量:

function printName() {  
  if(true) {
    var name = "Rafael";
  }
  console.log(name); // Rafael
}

　　注意到，不像Java或者許多其他語言那樣，Javascript中任何在一個函數內部創建的變量都會被提升到函數的頂部。這就意味著無論你在哪里聲明的變量，效果就像都是在函數頂部聲明的一樣。這種行為就叫做提升
　　所以上面的函數可以理解成下面這樣：

function printName() {  
  var name; // variable declaration is hoisted to the top
  if(true) {
    name = "Rafael";
  }
  console.log(name); // Rafael
}

　　那么，let是如何工作的呢？
　　我們用同樣的例子來看看:

function printName() {  
  if(true) {
    let name = "Rafael";
  }
  console.log(name); // ReferenceError: name is not defined
}

　　由于let是在塊內部，所以name變量只能在塊中訪問。

function printName() {  
  var name = "Hey";
  if(true) {
    let name = "Rafael";
    console.log(name); // Rafael
  }
  console.log(name); // Hey
}

　　在這個例子中，由于let引用了已經聲明的變量，所以"Rafael"只在塊內部合法。在塊的外部name的值是"Hey"。
　　總之，var是函數作用域的而let是塊級作用域的。

const

　　Javascript在過去很長一段時間都不支持創建常量。隨著ES6的到來，你將可以創建常量并且保證它的值不會被改變。
　　創建常量的語法如下:

const SERVER_URL = "http://frontendjournal.com"  

其他有趣的特性

　　ECMAScript 6 同時還帶來了很多其他特性:Map，WeakMap，Generators和Proxies。

什么時候可以開始使用ES6？

　　Firefoxs是支持最多特性的瀏覽器而Juriy Zaytsev已經把主要瀏覽器的支持列出來了。 http://kangax.github.com/es5-compat-table/es6/
　　一些ES6特性在NodeJS中也可以使用。可以查看Alex Young的博客ES6 for Node。

結論

　　下一個版本的Javascript會帶來一個更加簡單更加友好的語法來幫助那些從面向對象語言轉過來的開發者的學習。現在的唯一的問題就是主要瀏覽器對ES6的全面支持還需要一些時間。

譯者注:

　　目前對ECMAScript 6支持比較好的兩個瀏覽器就是Chrome和Firefox，為了更好地體驗ES6，我們需要下載開發者版本的瀏覽器，Chrome Canary 下載地址，Firefox Aurora 下載地址。
　　要在Firfox中開啟ECMAScript 6，需要把