promise简单总结

promise一些总结

Promise 对象 - ECMAScript 6入门 (ruanyifeng.com)
// 一般情况下是有异步操作时,使用Promise对这个异步操作进行封装
// new -> 构造函数(1.保存了一些状态信息 2.执行传入的函数)
// 在执行传入的回调函数时, 会传入两个参数, resolve, reject.本身又是函数

特点：

（1）对象的状态不受外界影响。

（2）一旦状态改变，就不会再变，任何时候都可以得到这个结果

1.基本使用

形式一

new Promise((resolve, reject) => {
    setTimeout(() => {
      // resolve('Hello World')// 成功的时候调用resolve
      //reject('error message')// 失败的时候调用reject
    }, 1000)
  }).then((res) => {
    //处理代码
    console.log(res);
  }).catch((err) => {
    console.log(err);
  })

形式二

new Promise((resolve, reject) => {
    setTimeout(() => {
      // resolve('Hello world')
     // reject('error message')
    }, 1000)
  }).then(
    res => {console.log(res);}, 
    err => { console.log(err);}
  )

2.链式调用

new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve('aaa')
    }, 1000)
  }).then(
    res => {
    // 1.自己处理10行代码
    console.log(res, '第一层的10行处理代码');
    // 2.对结果进行第一次处理
    return res + '111'
  }).then(res => {
    console.log(res, '第二层的10行处理代码');
    return res + '222'
  }).then(res => {
    console.log(res, '第三层的10行处理代码');
  })

3.all方法

Promise.all([
     new Promise((resolve, reject) => {
       $.ajax({
         url: 'url1',
         success: function (data) {
           resolve(data)
         }
       })
     }),
     new Promise((resolve, reject) => {
       $.ajax({
         url: 'url2',
         success: function (data) {
           resolve(data)
         }
       })
     })
  ]).then(results => {//所有请求成功
    console.log(results);
  })

4.any方法

Promise.any([
  fetch('https://v8.dev/').then(() => 'home'),
  fetch('https://v8.dev/blog').then(() => 'blog'),
  fetch('https://v8.dev/docs').then(() => 'docs')
]).then((first) => {  // 只要有一个 fetch() 请求成功
  console.log(first);
}).catch((error) => { // 所有三个 fetch() 全部请求失败
  console.log(error);
});