Promise

Promise（期约）

let p = new Promise(function(resolve, reject) {
   //二者选一，有一个出现，后面那个就会失效
   //resolve(data)
   //reject('Error')
})

.then()

p.then((data) => {
   //这个函数对应resolve（解决）
},
(err) => {
   //这个函数对应reject（拒绝）
})

.catch()

p.catch((err) => {

})
//语法糖，等同于p.then(null, () => {})

.finally()

//无论是resolve还是reject都可以触发该函数，一般用于有resolve（解决）和reject（拒绝）的公共部分，避免代码重复
p.finally(() => {})

Promise.all( Promise[] )

Promise[]是个期约数组，all接收数组中所有的期约，然后返回一个新的期约
//用法
let p1 = Promise.resolev('P1')
let p2 = Promise.resolev('P2')
let p3 = Promise.resolev('P3')

let p = Promise.all([ p1, p2, p3 ])
p.then((values) => {
   console.log(values)  //[ 'P1', 'P2', 'P3']
}, null)
/*
*p1, p2, p3中若有任一个是拒绝（reject），则Promise.all()就是个拒绝（reject）期约
*，且该拒绝期约就是第一个出现的拒绝期约
*/
eg：p2 = Promise.reject('P2')
p.then((values) => {
   console.log(values)
}, (err) => {
   console.log(err)  //P2
})

Promise.race([ Promise[] ])

接收一数组的期约，返回最先被解决/拒绝的期约
let p1 = Promise.reject(1)
let p2 = Promise.reject(2)
let p3 = Promise.reject(3)

let p = Promise.race([ p1, p2, p3 ])
//warning: 必须使用setTimeout(console.log, layout, p)计时器，因为期约是异步的，直接打印是同步的，如果不用计时器做异步操作，就会再所有期约解决/拒绝前打印结果，其中的layout也是根据实际情况定，要在至少一个期约解决/拒绝后再打印，才会有值
console.log(p) //x
setTimeout(console.log, 0, p)  //1

p1 = new Promise(function(resolve, rejece) {
   setTimeout(resolve, 10, '1')  //10s后
})
p2 = new Promise(function(resolve, rejece) {
   setTimeout(resolve, 8, '2')  //8s后
})
p3 = new Promise(function(resolve, rejece) {
   setTimeout(resolve, 12, '3')  //12s后
})

p = Promise.race([ p1, p2, p3 ])
setTimeout(console.log, layout, p)     //此处layout应该>=8，打印结果为 '2' 

Promise后续期约使用亲一个期约的返回值，实现串联期约

funtion a(num) { return num + 10 }
funtion b(num) { return num * 10 }
funtion c(num) { return num + '' }
funtion d(str) { console.log(str)}

Promise.resolve(5)
   .then(a)
   .then(b)
   .then(c)
   .then(d)    //'150'

then(), catch(), finally()都不是立刻执行的，而是必须等Promise.resolve/reject后才会执行

function foo() {
   console.log('run')
   return new Promise((resolve) => {
      setTimeout(() => {
         resolve('foo')
      }, 1000)
   })
}
//此处先'run'然后等1s再打印'foo'，（即.then不会立即执行，而会等1s，说明then是被动触发的）
foo().then((msg) => console.log(msg))

await的影响

let p: any
async function foo() {
   p = await new Promise((resolve) => {  //【1】
      setTimeout(() => {
         resolve('foo')
      }, 1000)
   })
}
foo()
p.then((msg: string) => console.log(msg))    //【2】

【1】若是有await则【2】会报错：p上没有then属性。因为await（暂停）要先把期约完成才会赋值给p，所以【2】在p被赋值期约之前执行
【1】若没有await则【2】在1s后打印'foo'。因为没有暂停，所以p上即时被赋予了期约的属性，但是期约未完成，要等1s（then是被动触发）