ECMAScript

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

JavaScript和ECMAScript

历史，1996年11月，JavaScript的创造者Netscape公司，决定将JavaScript提交给标准化组织ECMA，希望这种语言能够成为国际标准。次年，ECMA发布了262号标准文件（ECMA-262）第一版，规定了浏览器脚本语言的标准，并将这种语言称为：ECMAScript，这个版本就是1.0版。

那么，ECMAScript和JavaScript的关系是，前者（ECMAScript）是后者（JavaScript）的规格，后者（JavaScript）是前者（ECMAScript）的一种实现，另外的ECMAScript方言还有Jscript和ActionScript。

ES5、ES6、ES7与ECMAScript 2015的关系

ES5，ECMAScript5.1，是ECMAScript标准的修正，2011年，ECMAScript 5.1版发布后，就开始制定6.0版了，因此，ES6这个词的原意，是指JavaScript语言的下一个版本。

ES6，ES2015，第一个版本，在2015年6月发布，正式名称是《ECMAScript 2015标准》（简称：ES2015），时间，2016年6月，小幅修订的《ECMAScript 2016标准》（简称 ES2016）如期发布，这个版本可以看作是：ES6.1版，因两者的差异非常小，基本上是同一个标准。根据计划，2017年6月发布ES2017标准。

ES7，ES2016，2016年3月发布，ECMA-262标准第7版的简称，从ES6开始每年发布一个版本，以年份作为名称，因此又称：ECMAScript2016，简称：ES2016，在ES6的基础上添加3项内容：求幂运算符（**）、Array.prototype.includes()方法、函数作用域中严格模式的变更。

ES8，ES2017，2017年6月，ES8是ECMA-262标准第8版的简称，特性：async、await异步解决方案。

ES6（ES2015）的基本语法

1、let声明变量

<script>
	// var声明的变量，没有局部作用域
	// let声明的变量，有局部作用域
	{
		var a = 0
		let b = 1
	}
	console.log(a) // 0
	console.log(b) // Uncaught ReferenceError: b is not defined
script>

<script>
	// var 可以声明多次
	// let 只能声明一次
	var m = 1
	var m = 2
	let n = 3
	let n = 4
	console.log(m) // 2
	console.log(n) // Uncaught SyntaxError: Identifier \'n\' has already been declared
script>

2、const声明常量（只读变量）

<script>
	// 1、声明之后不允许改变
	const PI = "3.1415926"
	PI = 3 // Uncaught TypeError: Assignment to constant variable.
script>

<script>
	// 2、一但声明必须初始化，否则会报错
	const MY_AGE // Uncaught SyntaxError: Missing initializer in const declaration
script>

3、解构赋值

解构赋值是对赋值运算符的扩展，是一种针对数组或者对象进行模式匹配，然后对其中的变量进行赋值，在代码书写上简洁且易读，语义更加清晰明了，也方便了复杂对象中数据字段获取。

<script>
	//1、数组解构
	// 传统
	let a = 1, b = 2, c = 3
	console.log(a, b, c)
	// ES6
	let [x, y, z] = [1, 2, 3]
	console.log(x, y, z)
script>

<script>
	//2、对象解构
	let user = {name: \'Helen\', age: 18}
	// 传统
	let name1 = user.name
	let age1 = user.age
	console.log(name1, age1)
	// ES6
	let { name, age } = user//注意：结构的变量必须是user中的属性
	console.log(name, age)
script>

4、模板字符串

模板字符串相当于加强版的字符串，用反引号 `，除了作为普通字符串，还可以用来定义多行字符串，在字符串中加入变量和表达式。

<script>
	// 1、多行字符串
	let string1 = `怜,
		怜怜怜怜怜怜怜怜怜怜怜怜怜怜怜怜怜怜怜`
	console.log(string1)
script>

<script>
	// 2、字符串插入变量和表达式。变量名写在 ${} 中，${} 中可以放入 JavaScript 表达式。
	let name = "怜"
	let age = 26
	let info = `My Name is ${name},I am ${age 1} years old next year.`
	console.log(info)
script>

<script>
	// 3、字符串中调用函数
	function f(){
		return "是函数!"
	}
	let string2 = `Game start,${f()}`
	console.log(string2); 
script>

5、声明对象简写

<script>
	const age = 26
	const name = "怜"
	// 传统
	const person1 = {age: age, name: name}
	console.log(person1)
	// ES6
	const person2 = {age, name}
	console.log(person2) 
script>

6、定义方法简写

<script>
	// 传统
	const person1 = {
		sayHi:function(){
			console.log("Hi")
		}
	}
	person1.sayHi();
	// ES6
	const person2 = {
		sayHi(){
			console.log("Hi")
		}
	}
	person2.sayHi() 
script>

7、对象拓展运算符

拓展运算符（…）用于取出参数对象所有可遍历属性然后拷贝到当前对象。

<script>
	// 1、拷贝对象
	let person1 = {name: "怜", age: 26}
	let someone = { ...person1 }
	console.log(someone)
	// 2、合并对象
	let age = {age: 26}
	let name = {name: "怜"}
	let person2 = {...age, ...name}
	console.log(person2) 
script>

8、箭头函数

箭头函数提供了一种更加简洁的函数书写方式，基本语法是：参数 => 函数体，箭头函数多用于匿名函数的定义。

<script>
	// 传统
	var f1 = function(a){
		return a
	}
	console.log(f1(1))
	// ES6
	var f2 = a => a
	console.log(f2(1))
script>

<script>
	// 当箭头函数没有参数或者有多个参数，要用()括起来。
	// 当箭头函数函数体有多行语句，用{}包裹起来，表示代码块，
	// 当只有一行语句，并且需要返回结果时，可以省略{}, 结果会自动返回。
	var f3 = (a,b) => {
		let result = a b
		return result
	}
	console.log(f3(6,2)) // 8
	// 前面代码相当于：
	var f4 = (a,b) => a b
	console.log(f4(6,2)) // 8
script>