1. 解构赋值

解构赋值 语法是一种 Javascript 表达式。通过解构赋值, 能够将属性/值从对象/数组中取出,赋值给其余变量:

const [name, { ball }] = ["wang", { ball: 45, study: 75 }];console.log(name, ball); // wang 45

上述办法解构除了用户姓名和 ball 的得分;

残余运算符 解构出对象剩下的局部:

let [name, ...rest] = ["wang", { ball: 45, study: 75 }];console.log(name, rest);

扩大运算符 将数组和对象剥离进去,可用于浅拷贝:

let wang = ["wang", { ball: 45, study: 75 }];let wangClone = [...wang];wang[0] = "li";console.log(wangClone, wang); // (2) ['wang', {…}] (2) ['li', {…}]

2. 箭头函数

箭头函数表达式的语法比函数表达式更简洁,并且没有本人的this,arguments,super或new.target。箭头函数表达式更实用于那些原本须要匿名函数的中央,并且它不能用作构造函数。

// ES5var x = function(x, y) {     return x * y;} // ES6const x = (x, y) => x * y;

如果只有一条语句能够同时省略 {} 和 return,须要留神的是同时省略。

3. Promise

Promise 结构器次要用于包装不反对promise(返回值不是Promise)的函数。

const promise1 = new Promise((resolve, reject) => {  setTimeout(() => {    resolve('foo');  }, 300);});promise1.then((value) => {  console.log(value);  // expected output: "foo"});console.log(promise1);// expected output: [object Promise]

利用 Promise 简略实现 axios

function myAsyncFunction(url) {  return new Promise((resolve, reject) => {    const xhr = new XMLHttpRequest()    xhr.open("GET", url)    xhr.onload = () => resolve(xhr.responseText)    xhr.onerror = () => reject(xhr.statusText)    xhr.send()  });}

Promise.all

const promise1 = Promise.resolve(3);const promise2 = new Promise((resolve, reject) => {  setTimeout(resolve, 200, 'wo');});const promise3 = new Promise((resolve, reject) => {  setTimeout(resolve, 100, 'foo');});Promise.all([promise1, promise2, promise3]).then((values) => {  console.log(values);});// expected output: Array [3, "wo", "foo"]

这个Promise的resolve回调执行是在所有输出的promise的resolve回调都完结,或者输出的iterable里没有promise了的时候。它的reject回调执行是,只有任何一个输出的promise的reject回调执行或者输出不非法的promise就会立刻抛出谬误,并且reject的是第一个抛出的错误信息。

Promise.race

const promise1 = new Promise((resolve, reject) => {  setTimeout(resolve, 500, 'one');});const promise2 = new Promise((resolve, reject) => {  setTimeout(resolve, 100, 'two');});Promise.race([promise1, promise2]).then((value) => {  console.log(value);  // Both resolve, but promise2 is faster});// expected output: "two"

Promise.race(iterable) 办法返回一个 promise,一旦迭代器中的某个promise解决或回绝,返回的 promise就会解决或回绝。

4. Proxy

在以下简略的例子中,当对象中不存在属性名时,默认返回值为 37。上面的代码以此展现了 get handler 的应用场景。

// 定义代理策略const handler = {    get: function(obj, prop) {        return prop in obj ? obj[prop] : 37;    }};const p = new Proxy({}, handler);p.a = 1;p.b = undefined;console.log(p.a, p.b);      // 1, undefinedconsole.log('c' in p, p.c); // false, 37

打印 p 对象: