共计 4975 个字符，预计需要花费 13 分钟才能阅读完成。
1.es6 相熟吗，说几个 es6 的新增办法
（1）新增申明命令 let 和const
在 es6 中通常用 let 和 const 来申明，let 示意 变量 、const 示意 常量。
特点：
let和const都是块级作用域。以 {} 代码块作为作用域范畴 只能在代码块外面应用。- 不存在变量晋升，只能先申明再应用，否则会报错。在代码块内，在申明变量之前，该变量都是不可用的。这在语法上，称为“暂时性死区”（temporal dead zone，简称 TDZ）。
- 在同一个代码块内，不容许反复申明。
- const 申明的是一个只读常量，在申明时就须要赋值。（如果
const的是一个对象，对象所蕴含的值是能够被批改的。形象一点儿说，就是对象所指向的地址不能扭转，而变量成员是能够批改的。）
（2）模板字符串（Template String）
用一对反引号 (`) 标识，它能够当作一般字符串应用，也能够用来定义多行字符串，也能够在字符串中嵌入变量，js 表达式或函数，变量、js 表达式或函数须要写在 ${}中。
var str = `abc
def
gh`;
console.log(str);
let name = "小明";
function a() {return "ming";}
- console.log(
我的名字叫做 ${name}，年龄 ${17+2}岁，性别 ${'男'}，游戏 ID：${a()});
（3）函数的扩大
- 函数的默认参数
ES6 为参数提供了默认值。在定义函数时便初始化了这个参数，以便在参数没有被传递进去时应用。
function A(a,b=1){console.log(a+b);
}
A(1); //2
A(2+3); //5
- 箭头函数
在 es6 中，提供了一种简洁的函数写法，咱们称作“箭头函数”。
写法：函数名 =(形参)=>{……} 当函数体中只有一个表达式时，{}和 return 能够省略，当函数体中形参只有一个时，()能够省略。
特点：箭头函数中的 this 始终指向箭头函数定义时的离 this 最近的一个函数，如果没有最近的函数就指向 window。
// 省略写法
var people = name => 'hello' + name;
var getFullName = (firstName, lastName) => {
var fullName = firstName + lastName;
return fullName;
}
（4）对象的扩大
- 属性的简写。ES6 容许在对象之中，间接写变量。这时，属性名为变量名, 属性值为变量的值。
var foo = 'bar';
var baz = {foo}; // 等同于 var baz = {foo: foo};
- 办法的简写。省略冒号与 function 关键字。
var o = {method() {return "Hello!";}
};
// 等同于
var o = {method: function() {return "Hello!";}
};
- Object.keys()办法，获取对象的所有属性名或办法名（不包含原形的内容），返回一个数组。
var obj={name: "john", age: "21", getName: function () {alert(this.name)}};
console.log(Object.keys(obj)); // ["name", "age", "getName"]
console.log(Object.keys(obj).length); //3
console.log(Object.keys(["aa", "bb", "cc"])); //["0", "1", "2"]
console.log(Object.keys("abcdef")); //["0", "1", "2", "3", "4", "5"]
- Object.assign ()，assign 办法将多个原对象的属性和办法都合并到了指标对象下面。能够接管多个参数，第一个参数是指标对象，前面的都是源对象。
var target = {}; // 指标对象
var source1 = {name : 'ming', age: '19'}; // 源对象 1
var source2 = {sex : '女'}; // 源对象 2
var source3 = {sex : '男'}; // 源对象 3，和 source2 中的对象有同名属性 sex
Object.assign(target,source1,source2,source3);
console.log(target); //{name : 'ming', age: '19', sex: '男'}
（5）for…of 循环
是遍历所有数据结构的对立的办法。for…of 循环能够应用的范畴包含数组、Set 和 Map 构造、某些相似数组的对象（比方 arguments 对象、DOM NodeList 对象）、Generator 对象，以及字符串。
var arr=["小林","小吴","小佳"];
for(var v of arr){console.log(v);
}
// 小林
// 小吴
// 小佳
（6）import 和 export
ES6 规范中，JavaScript 原生反对模块 (module) 了。这种将 JS 代码宰割成不同性能的小块进行模块化，将不同性能的代码别离写在不同文件中，各模块只需导出公共接口局部，而后通过模块的导入的形式能够在其余中央应用。
export 用于对外输入本模块（一个文件能够了解为一个模块）变量的接口。
import 用于在一个模块中加载另一个含有 export 接口的模块。
import 和 export 命令只能在模块的顶部，不能在代码块之中。
// 导入局部
// 全副导入
import Person from './example'
// 将整个模块所有导出内容当做繁多对象，用 as 起别名
import * as example from "./example.js"
console.log(example.name)
console.log(example.getName())
// 导入局部
import {name} from './example'
// 导出局部
// 导出默认
export default App
// 局部导出
export class User extend Component {};
（7）Promise 对象
Promise 是异步编程的一种解决方案，将异步操作以同步操作的流程表达出来，防止了层层嵌套的回调函数。
它有三种状态，别离是 pending- 进行中、resolved- 已实现、rejected- 已失败。
Promise 构造函数蕴含一个参数和一个带有 resolve（解析）和 reject（回绝）两个参数的回调。在回调中执行一些操作（例如异步），如果所有都失常，则调用 resolve，否则调用 reject。对于曾经实例化过的 promise 对象能够调用 promise.then() 办法，传递 resolve 和 reject 办法作为回调。then()办法接管两个参数：onResolve 和 onReject，别离代表以后 promise 对象在胜利或失败时。
1. var promise = new Promise((resolve, reject) => {
2. var success = true;
3. if (success) {4. resolve('胜利');
5. } else {6. reject('失败');
7. }
8. }).then(9. (data) => {console.log(data)},
10. (data) => {console.log(data)}
11. )
promise 的执行过程
1. setTimeout(function() {2. console.log(0);
3. }, 0);
4. var promise = new Promise((resolve, reject) => {5. console.log(1);
6. setTimeout(function () {
7. var success = true;
8. if (success) {9. resolve('胜利');
10. } else {11. reject('失败');
12. }
13. },2000);
14. }).then(15. (data) => {console.log(data)},
16. (data) => {console.log(data)}
17. );
18. console.log(promise); //<pending> 进行中
19. setTimeout(function () {20. console.log(promise); //<resolved> 已实现
21. },2500);
22. console.log(2);
24. //1
25. //Promise {<pending>}
26. //2
27. //0
28. // 胜利
29. //Promise {<resolved>: undefined}
（8）解构赋值
ES6 容许依照肯定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构（Destructuring）。
- 数组的解构赋值
数组中的值会主动被解析到对应接管该值的变量中，数组的解构赋值要一一对应 如果有对应不上的就是 undefined
1. var [name, pwd, sex]=["小周", "123456", "男"];
2. console.log(name) // 小周
3. console.log(pwd)//123456
4. console.log(sex)// 男
- 对象的解构赋值
对象的解构与数组有一个重要的不同。数组的元素是按秩序排列的，变量的取值由它的地位决定；而对象的属性没有秩序，变量必须与属性同名，能力取到正确的值。
1. var obj={name:"小周", pwd:"123456", sex:"男"}
2. var {name, pwd, sex}=obj;
3. console.log(name) // 小周
4. console.log(pwd)//123456
5. console.log(sex)// 男
7. // 如果想要变量名和属性名不同，要写成这样
8. let {foo: foz, bar: baz} = {foo: "aaa", bar: "bbb"};
9. console.log(foz) // "aaa"
10. console.log(foo) // error: foo is not defined
（9）set 数据结构
Set 数据结构，相似数组。所有的数据都是惟一的，没有反复的值。它自身是一个构造函数。
属性和办法：
- size 数据的长度
- add() 增加某个值，返回 Set 构造自身。
- delete() 删除某个值，返回一个布尔值，示意删除是否胜利。
- has() 查找某条数据，返回一个布尔值。
- clear() 革除所有成员，没有返回值。
利用：数组去重。
1. var arr = [1,1,2,2,3];
2. var s = new Set(arr);
3. console.log(s); //{1, 2, 3}
5. console.log(s.size); //3
6. console.log(s.add(4)); //{1, 2, 3, 4}
7. console.log(s.delete(4)); //true
8. console.log(s.has(4)); //false
9. s.clear();
（10）Spread Operator 开展运算符(…)
- 将字符串转成数组
1. var str="abcd";
2. console.log([...str]) // ["a", "b", "c", "d"]
- 将汇合转成数组
1. var sets=new Set([1,2,3,4,5])
2. console.log([...sets]) // [1, 2, 3, 4, 5]
- 两个数组的合并
1. var a1=[1,2,3];
2. var a2=[4,5,6];
3. console.log([...a1,...a2]); //[1, 2, 3, 4, 5, 6]
- 在函数中，用来代替 arguments 参数
rest 参数 …变量名称
rest 参数是一个数组，它的前面不能再有参数，不然会报错
1. function func(...args){2. console.log(args);//[1, 2, 3, 4]
3. }
4. func(1, 2, 3, 4);
6. function f(x, ...y) {7. console.log(x);
8. console.log(y);
9. }
10. f('a', 'b', 'c'); //a 和 ["b","c"]
11. f('a') //a 和 []
12. f() //undefined 和 []