promise方法

Promise.all([ .. ]) 接受一个或多个值的数组（比如，立即值、promise、thenable）。它返回一个promise。

如果所有的值都完成，这个promise 的结果是完成；

一旦它们中的某一个被拒绝，那么这个promise 就立即被拒绝。

Promise.all([p1, p2, p3])
        .then((res) => {
          console.log(res) 
        })
        .catch((err) => {
          console.log(err)
        })

 Promise.allSettled()所有的Promise对象均出现结果（无论成功或失败）后才会执行allSettled中的then回调（只会进入then回调）    在所有 Promise 对象都 settle 后返回一个新的 Promise 对象，该对象的 Fulfill 状态的值是一个数组，包含每个 Promise 对象的 settle 状态信息（即不管 resolve 还是 reject 都会被处理）注意：若有错误抛出，则抛出错误信息，并终止函数

Promise.allSettled([p1, p2, p3])
        .then((res) => {
          console.log(res)
        })
        .catch((err) => {
          console.log(err)
        })

Promise.race() 函数返回一个 Promise，它将与第一个传递的 promise 相同的完成方式被完成。它可以是完成（ resolves），也可以是失败（rejects），这要取决于第一个完成的方式是两个中的哪个。

Promise.race([p1, p2, p3])
        .then((res) => {
          console.log(res) //
        })
        .catch((err) => {
          console.log(err)
        })

 Promise.any()所有的Promise对象均失败后才会执行any中的失败回调，否则当任意一个Promise对象成功就会直接进入then回调

      Promise.any([p1, p2, p3])
        .then((res) => {
          console.log(res) //
        })
        .catch((err) => {
          console.log(err)
        })

async的概念

Async/Await 代码看起来简洁一些，使得异步代码看起来像同步代码     

async function getInfo() {
  const response = await fetch('https://api.example.com/data');
  const data = await response.json();
  return data;
}

getInfo().then(data => console.log(data));

  async函数一定会返回一个promise对象。如果一个async函数的返回值看起来不是promise，那么它将会被隐式地包装在一个promise中。sync await是基于Promise实现的，不能用于普通的回调函数

function showInfo () {
  return 'hello'
}

function queryData () {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve('nihao')
    }, 2000)
  })
}


async function getResult () {
  let ret = await queryData()
  return ret
async function testData () {
  
  getResult().then(res => {
    console.log(res)
  })

}

testData()

JS事件循环(事件环、eventloop)

S代码执行机制JS是单线程，同一时间只能做一件事，为了避免耗时任务阻塞代码，JS通过事件循环来处理这种耗时任务(异步)

1 先同步 后异步2 异步分微任务(then,catch方法），宏任务(ajax、定时器、事件回调、script标签)

JS事件循环

      1 先执行宏任务(解析script标签)

      2 从上往下执行，遇到同步代码，立刻放入js调用栈执行

       遇到宏任务放到宿主环境(浏览器)，遇到微任务放入微任务队列

       当宿主环境的时间到或事件触发，对应的回调进入宏任务队列

      3 当JS调用栈空闲时，会清空微任务队列，然后在执行宏任务队列

console.log(1) // 同步
    // 异步
    setTimeout(() => {
      console.log(2)
    }, 100)
    setTimeout(() => {
      console.log(6)
    }, 0)
    setTimeout(() => {
      console.log(8)
    }, 200)
    // then是异步
    Promise.resolve(123).then(() => {
      console.log(4)
    })
    Promise.resolve(123).then(() => {
      console.log(9)
    })
    // 同步
    console.log(3)