一. ECMAScript 6

es6 和JavaScript的关系是什么？

ECMAScript 和 JavaScript 的关系是，前者是后者的规格，后者是前者的一种实现（另外的 ECMAScript 方言还有 Jscript 和 ActionScript） 本质上就是JavaScript，是它的一种新规范！

1. 简介

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

2. 基本语法

2.1 let申明变量

作用域范围

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

申明次数

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

2.2 const申明常量（只读不能修改）

声明后不能改变

const PI = "3.1415926"
PI = 3  // TypeError: Assignment to constant variable.

一旦申明后必须初始化，否则会报错

const MY_AGE  // SyntaxError: Missing initializer in const declaration

2.3 解构赋值

数组解构

// 传统
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)

对象解构

let user = {name:"zhangsan",age:14}

//传统
let name1 = user.name
let age = user.age

//es6
let {name,age} = user  //注意：解构的变量必须是user的变量

console.log(name,age)

2.4 模板字符串 `

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

多行字符串

let string1 =  `Hey,
can you stop angry now?`
console.log(string1)
// Hey,
// can you stop angry now?

字符串中插入变量和表达式，变量名写在 ${}中，$ {}中也可以放入js表达式

let name = 'zhangsan'
let age = 18

let info = `My Name is ${name},I am ${age+1} years old next year.`
console.log(info)
// My Name is Mike,I am 28 years old next year.

字符串中调用函数

function f(){
    return "have fun!"
}
let string2 = `Game start,${f()}`
console.log(string2);  // Game start,have fun!

2.5 申明对象简写

const name = 'zhangsan'
const age = 14

//传统
const person = {name:name,age:age}
//es6
const person = {name,age}
console.log(person2) //{age: 12, name: "Amy"}

2.6 定义方法简写

//传统
const person1 = {
    sayHi = function() {
        console.log("Hi")
    }
}
person1.sayHi()

//es6
const person2 = {
    sayHi() {
        console.log("Hi")
    }
}
person2.sayHi()

2.7 对象扩展运算符

1.复制对象

let person = {name:'zhagnsan',age:18}
let someone = {...person}

console.log(someone) //{name: "Amy", age: 15}

合并对象

let age = {age: 15}
let name = {name: "Amy"}
let person2 = {...age, ...name}
console.log(person2)  //{age: 15, name: "Amy"}

2.8 箭头函数

箭头函数提供了一种更加简介的函数书写方式,多用于匿名函数的定义。它的基本语法是

参数=>函数体

单个参数，单行方法体

//传统
var f1 = function(a) {
    return a
}
console.log(f1(1))

//es6
f2 = a=> a
console.log(f2)

多个参数，多行方法体

var f3 = (a,b)=> {
            let result = a+b
            return result
        }
 console.log(f3(6,2))  // 8

es6基本语法入门学习