在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相关方面的内容。(未完待续)
