前端学习总结（十八）ES6——新一代的javascript

简介

ECMAScript 6（以下简称ES6）是JavaScript语言的下一代标准，已于2015年6月正式发布。它的目标，是使得JavaScript语言可以用来编写复杂的大型应用程序，成为企业级开发语言。

支持情况

各大浏览器的最新版本，对ES6的支持可以查看kangax.github.io/es5-compat-table/es6/。随着时间的推移，支持度已经越来越高了，ES6的大部分特性都实现了。

ES6转ES5

Babel转码器

Babel是一个广泛使用的ES6转码器，可以将ES6代码转为ES5代码，从而在现有环境执行。这意味着，你可以用ES6的方式编写程序，又不用担心现有环境是否支持。

Babel在线转换
Babel提供一个REPL在线编译器，可以在线将ES6代码转为ES5代码。转换后的代码，可以直接作为ES5代码插入网页运行。

Traceur转码器
Google公司的Traceur转码器，也可以将ES6代码转为ES5代码。

Traceur在线转换
Traceur也提供一个在线编译器，可以在线将ES6代码转为ES5代码。转换后的代码，可以直接作为ES5代码插入网页运行。

ES6新特性

1 let

作用：声明变量。用法类似于var，但它所声明的变量，只在let命令所在的代码块内有效。

不存在变量提升，变量一定要在声明后使用，否则报错。

不允许重复声明，let不允许在相同作用域内，重复声明同一个变量。

2 块级作用域

ES5只有全局作用域和函数作用域，没有块级作用域，这带来很多不合理的场景。（1）内层变量可能会覆盖外层变量。（2）用来计数的循环变量泄露为全局变量。

let实际上为JavaScript新增了块级作用域。另外可以用{}声明一个块级作用域。

外层作用域无法读取内层作用域的变量。也不会受到内层作用域变量的影响。块级作用域的出现，实际上使得获得广泛应用的立即执行匿名函数（IIFE）不再必要了。

另外，ES6也规定，函数本身的作用域，在其所在的块级作用域之内。

3 const

const 声明一个只读的常量。一旦声明，常量的值就不能改变。作用域与let命令相同：只在声明所在的块级作用域内有效，不提升，不可重复声明。

4 全局对象属性

全局对象是最顶层的对象，浏览器环境指window对象，Node.js指global对象。ES5中，全局对象的属性与全局变量等价。

ES6规定，var命令和function命令声明的全局变量，依旧是全局对象的属性；let命令、const命令、class命令声明的全局变量，不属于全局对象的属性。也就是说，从ES6开始，全局变量将逐步与全局对象的属性脱钩。

5 变量解构赋值

ES6允许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构（Destructuring）。

以前，为变量赋值，只能直接指定值。

var a = 1;
var b = 2;
var c = 3;

ES6允许写成这样：

var [a, b, c] = [1, 2, 3];

本质上，这种写法属于“模式匹配”，只要等号两边的模式相同，左边的变量就会被赋予对应的值。

如果解构不成功，变量的值就等于undefined。

6 字符串的扩展

（扩展内容较多，只选择我觉得重要有用的部分）

（1）模板字符串

传统的JavaScript语言，输出模板通常是这样写的。

$('#result').append(
  'There are <b>' + basket.count + '</b> ' +
  'items in your basket, ' +
  '<em>' + basket.onSale +
  '</em> are on sale!&#