在2015年2月20號 ECMAScript 第六版就正式推出了，這門語言一直保持穩定快速的發展而且新功能也在慢慢被現在主流的 JavaScript 引擎所接受。
代碼轉換
能夠實現 ES6 到 ES5 的代碼轉換多虧了 Babel (以前叫 6to5) 以及 Traceur 之類的項目。這些轉換器 (更準確地說是源代碼到源代碼的編譯器) 可以把你寫的符合 ECMAScript 6 標準的代碼完美地轉換為 ECMAScript 5 標準的代碼，并且可以確保良好地運行在所有主流 JavaScript 引擎中。
我們這里目前在使用 Babel，主要是因為它對 ES6 的支持程度比其它同類更高，而且 Babel 擁有完善的文檔和一個很棒的在線交互式編程環境。
分享一種簡單的方法
a.
首先通過npm下載 (或者到官網手動下載)
$ npm install -g traceur
b.
引入
<script src="../traceur.js" type="text/javascript"></script> <!-- 將Traceur編譯器用于網頁 -->
c.
<script>new traceur.WebPageTranscoder(document.location.href).run(); </script>
<script type="module">
可以在里面編寫代碼
</script>
當然還有更多的方法，歡迎互相學習！
開啟ES6的入門學習
let
let是ES6中新增關鍵字。
它的作用類似于var，用來聲明變量，但是所聲明的變量，只在let命令所在的代碼塊內有效。（簡單理解，let有有作用域）
if(true){
var a = 1;
let b = 2;
}
document.write(a);
document.write(b); // 報錯：ReferenceError: b is not defined
for循環的計數器，就很合適使用let命令。
var a = [];
for (let i = 0; i < 10; i++) {
a[i] = function () {
document.write(i);
};
}
const
1.聲明的是常量，一旦聲明，值將是不可變的。
const PI = 3.1415;
console.log(PI);//3.1415
PI = 3;
console.log(PI);//3.1415
2.const 也具有塊級作用域
if (true) {
const max = 5;
}
document.write(max); // ReferenceError 常量MAX在此處不可得
3.const不可以重復聲明
var message = "Hello!";
let age = 25;
// 以下兩行都會報錯
const message = "Goodbye!";
const age = 30;
repeat
repeat表示重復幾次
var str = "x";
console.log(str.repeat(3));// "xxx"
var str1 = "hello";
str1.repeat(2) // "hellohello"
模板字符串
``兩個點（一般在左上角1前面）
let first = '我叫張三';
let last = '我是代碼搬磚工';
document.write(first+'--'+last);//拼接字符串方法
document.write(`${first}---${last}`);//模板方法
ES6的默認參數
括號之間可以寫默認值，若無參數，則是默認值；
1.運用傳統的默認參數
function sayHello(name){
//傳統的指定默認參數的方式
var name = name|| 'grape';
document.write('Hello '+name);
}
sayHello(); //輸出：Hello grape
sayHello('我是代碼搬磚工'); //輸出：Hello我是代碼搬磚工
2.運用ES6的默認參數
function sayHello2(name='grape'){
document.write(`Hello ${name}`); /*注意引號*/
}
sayHello2(); //輸出：Hellogrape
sayHello2('我是代碼搬磚工'); //輸出：Hello我是代碼搬磚工
三個點運算符 ...
括號之間可以寫默認值，若無參數，則是默認值；
- “...” 能很好的將數組內的數據，與變量一一匹配（當然可以是更多的數據）
var people=['張三','李四','王五'];
//sayHello函數本來接收三個單獨的參數people1，people2和people3
function sayHello(people1,people2,people3){
document.write(`Hello ${people1},${people2},${people3}`);
}
//但是我們將一個數組以拓展參數的形式傳遞，它能很好地映射到每個單獨的參數
sayHello(...people); //輸出：Hello 張三,李四,王五
2.拼接數組
var arr1 = ['a', 'b'];
var arr2 = ['c','b'];
var arr3 = ['d', 'e'];
// ES5的合并數組
arr1.concat(arr2, arr3);
// [ 'a', 'b', 'c', 'd', 'e' ]
// // ES6的合并數組
console.log([...arr1, ...arr2, ...arr3]);
// [ 'a', 'b', 'c', 'd', 'e' ]
箭頭函數=>
- 箭頭函數是使用=>語法的函數簡寫形式。這在語法上與 C#、Java 8 和 CoffeeScript 的相關特性非常相似。
ES5寫法
var array = [1, 2, 3];
// //傳統寫法
array.forEach(function(v, i, a) {
document.write(v);
});
ES6方法
array.forEach(v => document.write(v));
array.forEach(（v，i, a） => document.write(v));//也可以多個參數
2.它們同時支持表達式體和語句體。與（普通的）函數所不同的是，箭頭函數和其上下文中的代碼共享同一個具有詞法作用域的this
ES5的方法
var person = {
_name: "張三",
_friends: ["Amy", "Bob", "Cinne", "Dylan", "Ellen"],
printFriends:function(){
var that=this;
this._friends.forEach( function(value, index) {
//因為this的指向不同，所以無法再下面的語句中直接使用this._friends
document.write(`${that._name} 的好朋友 ${value} <br/>`)
});
}
}
person.printFriends();
ES6的方法
var person = {
_name: "張三",
_friends: ["Amy", "Bob", "Cinne", "Dylan", "Ellen"],
printFriends:function(){
this._friends.forEach((value,key)=>document.write(this._name+'的好朋友'+value+' <br/>'));
//.bind(this) 表示把當前this 給綁定的方法
}
}
person.printFriends();
目前是比較常用的ES6，簡單的分享一下自己的理解，后期會不定期更新ES6相關方面的內容。(未完待續)
