1.5.1 变量声明
1．let、var和const
在ES 6语法中，新增了let和const来声明变量，在ES 6之前，ES 5中只有全局作用域和函数作用域，代码如下：
if(true) {
var a = 'Tom'
}
console.log('a',a) // Tom
作用域是一个独立的地盘，让变量不外泄出去，但是上面的代码中的变量a就作为全局作用域外泄了出去，所以此时JavaScript没有区块作用域（或称为块级作用域）的概念。
在ES 6中加入区块作用域之后，代码如下：
if(true) {
let a = 'Tom'
}
console.log('a',a) // Uncaught ReferenceError: a is not defined
let和var都可以用来声明变量，但是在ES 6中，有下面一些区别：
· 使用var声明的变量没有区块的概念，可以跨块访问。
· 使用let声明的变量只能在区块作用域中访问，不能跨块访问。
在相同的作用域下，使用var和let具有相同的效果，建议在ES 6语法中使用let来声明变量，这样可以更加明确该变量所处的作用域。
const表示声明常量，一般用于一旦声明就不再修改的值，并且const声明的常量必须经过初始化，代码如下：
const a = 1
a = 2 // Uncaught TypeError: Assignment to constant variable
const b // Uncaught SyntaxError: Missing initializer in const declaration
总结一下，如果在ES 5中习惯了使用var来声明变量，在切换到ES 6时，就需要思考一下变量的用途和类型，选择合适的let和const来使代码更加规范和语义化。
2．箭头函数
ES 6新增了使用“箭头”（=>）声明函数，代码如下：
let f = v => v
// 等同于
var f = function (v) {
return v
}
如果箭头函数不需要参数或需要多个参数，就使用一个圆括号代表参数部分，当函数的内容只有返回语句时，可以省去大括号和return指令，代码如下：
let f = () => 5
// 等同于
var f = function () { return 5 }
let sum = (num1, num2) => num1 + num2;
// 等同于
var sum = function(num1, num2) {
return num1 + num2
}
如果箭头数的内容部分多于一条语句，就要用大括号将它们括起来，并且使用return语句返回，代码如下：
let sum = (num1, num2) => {
let num = 0
return num1 + num2 + num;
}
箭头函数会默认绑定外层的上下文对象this的值，因此在箭头函数中，this的值和外层的this是一样的，不需要使用bind或者call的方法来改变函数中的上下文对象，例如下面的代码：
mounted () {
this.foo = 1
setTimeout(function(){
console.log(this.foo) // 打印出1
}.bind(this),200)
}
//相当于
mounted () {
this.foo = 1
setTimeout(() => {
console.log(this.foo) // 同样打印出1
},200)
}
上面的代码中，在Vue.js的mounted方法中，this指向当前的Vue组件的上下文对象，如果想要在setTimeout的方法中使用this来获取当前Vue组件的上下文对象，那么非箭头函数需要使用bind，箭头函数则不需要。
箭头函数是实战项目中使用最多的ES 6语法，所以掌握好其规则和用法是非常重要的。
3．对象属性和方法的简写
ES 6允许在大括号中直接写入变量和函数，作为对象的属性和方法，这样的书写更加简洁，代码如下：
const foo = 'bar'
const baz = {foo}
// 等同于
const baz = {foo: foo}
console.log(baz) // {foo: "bar"}
对象中如果含有方法，也可以将function关键字省去，代码如下：
{
name: 'item',
data () {
return {
name:'bar'
}
}
mounted () {
},
methods: {
clearSearch () {
}
}
}
// 相当于
{
name: 'item',
data :function() {
return {
name:'bar'
}
}
mounted :function() {
},
methods: {
clearSearch :function() {
}
}
}
在上面的代码中，展示了采用ES 6语法来创建Vue组件所需的方法和属性，包括name属性、mounted方法、data方法等，是后面实战项目中经常使用的写法。
4．对象解构
在ES 6中，可以使用解构从数组和对象中提取值并赋给独特的变量，代码如下：
// 数组
const input = [1, 2];
const [first, second] = input;
console.log(first,second) // 1 , 2
// 对象
const o = {
a: "foo",
b: 30,
c: "Johnson"
};
const {a, b, c} = o;
console.log(a,b,c) // foo , 30 , Johnson
在上面的代码中，花括号“{ }”表示被解构的对象，a、b和c表示要将对象中的属性存储到其中的变量中。