目录

ES的兼容性

 let 和 const 命令

类 Class

函数参数默认值 

箭头函数

模板字符串

ES的兼容性

一定要明白，即便 ES2015 到 ES2019 已经发布，也不是所有的浏览器都支持新特性。为了 获得更好的体验，最好使用你选择的浏览器的最新版本。 通过以下链接，你可以检查在各个浏览器中哪些特性可用。

•  ES2015（ES6）：http://kangax.github.io/compat-table/es6/
• ES2016+：http://kangax.github.io/compat-table/es2016plus/

根据上面链接中的兼容性表格来看，它的大部分功能在现代浏览器中都可以使用。即使有些 ES2016+的特性尚未支持，但是我们还是可以开始使用新语法和新功能了。

 let 和 const 命令

在ES6以前，js只有var一种声明方式，在ES6之后 新增 let 和 const两种方式。var 定义的变量没有块级作用域的概念，let和const声明的都有块级作用域。

• let 的用法类似于var，但是所声明的变量，只在let命令所在的代码块内有效。
• const声明的是一个只读的常量。一旦声明，常量的值就不能改变。

{let a = 1;var b = 1;const c = 3;
}// let const 的块级作用域
a // ReferenceError: a is not defined.
b // 1
c // ReferenceError: a is not defined.// const 声明的常量不能重复赋值，let可以
const d = 4
let e = 5
d = 6    //  Assignment to constant variable.
e = 7
e    // 7

let、const和var的区别：在 变量提升、全局变量、重复声明、重复赋值、暂时死区、块级作用域、只声明不初始化功能的区别

var不会块级作用域，和暂时死区,其他都可以。

let 块级作用域，可重复赋值但是不能 变量提升、全局变量、重复声明。

const 只有暂时死区和块级作用域，其他都不可以。在声明的时候就必须赋值。

类 Class

在ES6之前，生成实例对象的传统方法是通过构造函数。如下：

function Book(name, page){this.name = name;    // 书名this.page = page;    // 页数
}
Person.prototype.getBookInfo = function () {return 'Book is ' + this.name + ', it is ' + this.page
}
var myBook = new Book('js',35)

ES6 提供了更接近传统语言的写法，引入了 Class（类）这个概念，作为对象的模板。通过class关键字，可以定义类。所以在ES6之后，上面的代码可以简化为：

class Book {constructor(name, page){this.name = name;this.page = page;}getBookInfo() {return 'Book is ' + this.name + ', it is ' + this.page}
}

函数参数默认值 

ES6 之前，不能直接为函数的参数指定默认值，只能采用变通的方法。像这样：

function changeName(name){var my_name = name || 'xiao'console.log(my_name)
}changeName('lisa')    // lisa
changeName('')    // xiao
changeName()    // xiao

上面代码检查函数changeName的参数name有没有赋值，如果没有，则指定默认值为xiao。这种写法的缺点在于，如果参数name赋值了，但是对应的布尔值为false，则该赋值不起作用。就像上面代码的最后一行，参数name等于空字符，结果被改为默认值。

在ES6里面，这个问题就可以解决：

function changeName(name = 'xiao'){console.log(my_name)
}changeName('lisa')    // lisa
changeName('')    // ''
changeName()    // xiao

箭头函数

ES6 允许使用“箭头”（=>）定义函数。箭头函数表达式的语法比函数表达式更简洁。在ES6前后的函数定义变化：

let fn = function (name) { return name
};
// es6里面
let fn = name => name;

相比之间是不是简介很多呢，而且如果箭头函数不需要参数或需要多个参数，就使用一个圆括号代表参数部分 像这样：

let fn = () => 'haha';
// es6之前是这样
let fn = function () { return 'haha' };

如果箭头函数的代码块部分多于一条语句，就要使用大括号将它们括起来，并且使用return语句返回。如果箭头函数只有一行语句，且不需要返回值，可以采用下面的写法，就不用写大括号了。

let fn = () => console.log('haha');

使用箭头函数需要注意：

• 函数体内的this对象，就是定义时所在的对象，而不是使用时所在的对象。
• 不可以当作构造函数，也就是说，不可以使用new命令，否则会抛出一个错误。
• 不可以使用arguments对象，该对象在函数体内不存在。如果要用，可以用 rest 参数代替。
• 不可以使用yield命令，因此箭头函数不能用作 Generator 函数。

尤其注意箭头函数里面的this的指向是可变的，但是在箭头函数的内部，this的指向是固定。

模板字符串

传统的 JavaScript 语言，拼接语句和输出模板通常是这样写的：

let name = 'javascript', money = 35
let str = 'This is '+name+',it is '+money+' dollar'console.log(str)    // "This is javascript,it is 35 dollar"

在ES6里面可以这样写：

let name = 'javascript', money = 35
let str = `This is ${name},it is ${money} dollar`console.log(str)    // "This is javascript,it is 35 dollar"