ES 6是JavaScript语言的新一代标准，加入了很多新的功能和语法。现在React项目一般都是用ES6语法来写，这也是官方推荐。
1. let 、const
let和const是ES 6中新政的两个关键字，用来声明便利，let和const都是块级作用域。let声明的变量只在let所在的代码块内有效。const变量声明一个只读的常量，一旦声明，常量的值就不能改变
// let 示例
{
var a = 1;
let b = 2;
}
a // 1
b // ReferenceError： b is not defined.
// cosnt 示例
const c = 3;
c = 4; // TypeError: Assignment to constant variable.
2. 箭头函数
ES 6允许使用“箭头”（=>）定义函数。这种方式创建的函数不需要function关键字，并且还可以省略return关键字。同时，箭头内的this指向函数定义时所在的上下文对象，而不是函数执行时所在的上下文对象。例如：
var f = a => a + 1;
// 等价于
var f = function(a) {
return a + 1;
}
function foo() {
this.bar = 1;
this.f = (a) => a + this.bar;
}
// 等价于
function foo() {
this.bar = 1;
this.f = (function(a) {
return a + this.bar;
}).bind(this);
箭头函数的参数多余一个或者不需要参数，就需要使用一个小括号代表参数部分。例如：
var f = () => 1;
var f = (a , b) => a + b;
如果函数体内包含的语句多余一条，就需要使用大括号将函数体括起来，并使用return关键字返回。例如：
var f = (x, y) => {
x++;
y--;
return x + y;
}
3. 模板字符串
模板字符串用反引号（`）标识字符串。除了可以当做普通字符串使用外，还可以用来定义多行字符串，以及在字符串中嵌入变量，功能强大。例如：
// 普通字符串
`Hello React!`
// 多行字符串
`Hello React~
React is wonderful!`
// 字符串嵌入变量
var name = 'React'
`hello, ${name}` // hello, React
4. 解构赋值
ES 6允许按照一定模式从数组和对象中提取值， 对变量进行赋值，即称为解构。例如：
// 数据解构
let [a, b, c] = [1, 2, 3]
a // 1
b // 2
c // 3
// 对象解构
let name = 'lee'
let age = 3
let person = {name, age}
person // Object {name: 'lee', age: 3}
// 反过来也是一样的
let person // Object {name: 'lee', age: 3}
let {name, age} = person
name // 'lee'
age // 3
// 函数参数解构赋值
function sum([x, y]) {
return x + y;
}
sum([1, 2]); // 3
// 对象参数解构赋值
function sum({x, y}) {
return x + y;
}
sum({1, 2}) // 3
// 嵌套解构赋值
// 数组嵌套
let [a, [b], c] = [1, [2], 3];
a // 1
b // 2
c // 3
// 对象嵌套
let {person: {name, age}, foo} = {person: {name: 'lee', age: 3}, foo: 'foo'}
name // 'lee'
age // 3
foo // 'foo'
5. reset参数
ES 6引入reset参数（形式为...变量名）用于获取函数的多余参数， 可以代替arguments对象的使用。rest参数是一个数组，数组中的元素是多余的参数。注意：rest参数不能再有其他参数。 例如：
function languages (lang, ...types) {
console.log(types);
}
languages('js', 'java', 'python'); // ['java', 'python']
6. 扩展运算符
扩展运算符是三个点（...），他将一个数组专为用逗号分隔的参数序列， 类似于rest参数的逆运算。例如：
function sum (a, b, c) {
return a + b + c;
}
let numbers = [1, 2, 3]
sum(...numbers) // 6
扩展运算符通常还可以用于合并数组以及解构赋值使用。例如：
let a = [1, 2]
let b = [3, 4]
[...a, ...b] // [1, 2, 3, 4]
let [x, ...rest] = ['a', 'b', 'c']
rest // ['b', 'c']
扩展运算符还可以用与去除参数对象的所有可便利属性，复制到当前对象中。例如：
let bar = {a: 1, b: 2}
let foo = {...bar}
foo // Object {a: 1, b: 2}
foo === bar // false
7. class
ES 6 引入了class（类）的概念，新的class写法让对象原型的写法更加清晰，也更像传统的面向对象编程语言的写法。
//定义一个类
class Person {
constructor (name, age) {
this.name = name;
this.age = age;
}
getName () {
return this.name;
}
getAge () {
return this.age;
}
}
// 创建对象
let person = new Person('lee', 3)；
class 同样可以通过extends关键字实现继承， 例如：
class Man extends Person {
constructor(name, age) {
super(name, age)
}
getGender() {
return 'male'
}
}
let man = new Man('Jack', 18)
8. import export
ES 6实现了自己的模块化标准，ES 6模块功能主要由两个关键字构成：export 和 import。export用与规定模块对外暴露的接口， import用与引入其他模块提供的接口。例如：
// index.js 导出默认接口和普通接口
cosnt foo = () => 'foo'
cosnt bar = () => 'bar'
export default foo
export {bar}
// a.js(假设在同一目录下) ，导入index.js的接口
import foo, {bar} from './index.js'
foo() // 'foo'
bar() // 'bar'
到此为止，本文几乎介绍了React常用到的ES 6基本语法，如还对ES 6 的其他语法感兴趣，建议去看看阮一峰老师的开源书籍ECMAScript 6 标准入门或者直接购买支持一下阮一峰老师的创作
