Promise知一二

转载作者：我是一只小鸟更新时间：2022-12-03 14:31:14

27

4

Promise

1.Promise的前置知识

进程（厂房）。
- 程序的运行环境
线程（工人）。
线程是实际进行运算的东西。
同步。
- 通常情况代码都是自上向下一行一行执行的
- 前边的代码不执行后边的代码也不会执行
- 同步的代码执行会出现阻塞的情况
- 一行代码执行慢会影响到整个程序的执行
解决同步的问题:
- java python 。
  - 通过多线程来解决，但是一般消耗资源比较多
- node.js 。
  - 通过异步方式来解决。
    
    我们可以这么理解：客人就好比我们请求的数据，服务员就好比客户端，厨师就好比服务器，我们现在客人点菜，服务员接收到菜的名称信息，给厨师说，厨师开始做，厨师在做的时候，客人一直等，不能干其他的事情，这就是同步，只能干一件事，我们现在利用异步的方式，可以让客人在课桌上等着菜来，也不影响服务员接收下一个客人的点菜，这样就可以很好的处理同步所带来的堵塞问题。
异步。
- 一段代码的执行不会影响到其他的程序
- 异步的问题：
异步的代码无法通过 return 来设置返回值。

特点:

不会阻塞其他代码的执行。

需要通过回调函数来返回结果。

                                
                                  function sum(a, b, cb) {
    setTimeout(() => {
        cb(a + b)  //调用箭头函数，把结果作为回调函数的参数
    }, 1000)
}

sum(123, 456, (result)=>{
    console.log(result)
})

基于回调函数的异步带来的问题。

代码的可读性差。

可调试性差(造成回调地狱) 。

                                
                                  sum(123, 456, (result)=>{
    sum(result, 7, (result)=>{
        sum(result, 8, result => {
            sum(result, 9, result => {
                sum(result, 10, result => {
                    console.log(result)
                })
            })
        })
    })
})

解决问题:
- 需要一个东西，可以代替回调函数来给我们返回结果
- Promise 横空出世
  - Promise是一个可以用来存储数据的对象
    - Promise存储数据的方式比较特殊，这种特殊的方式使得Promise可以用来存储异步调用的数据

2.Promise介绍

异步调用必须要通过回调函数来返回数据，当我们进行一些复杂的调用时，会出现回调地狱。

问题:

异步必须通过回调函数来返回结果，回调函数增加就不容易处理。

Promise
- Promise可以帮助我们解决异步中的回调函数的问题
- Promise就是一个用来存储数据的容器
  - 它拥有着一套特殊的存储数据的方式
  - 这个方式使得它里面可以存储异步调用的结果

创建Promise 。

创建Promise时，构造函数中需要一个函数作为参数。

Promise构造函数的回调函数，它会在创建Promise时调用，调用时会有两个参数传递进去。

                                
                                  const promise = new Promise((resolve, reject)=>{
    // resolve 和 reject 是两个函数，通过这两个函数可以向Promise中存储数据
    // resolve 在执行正常的时候存储数据， reject 是在执行错误的时候存储数据
    resolve('我是正常执行的时候调用的')
    reject('我是错误执行的时候调用的')
    //通过函数来访问Promise中添加数据，好处就是可以用来添加异步调用的数据
    setTimeout(()=>{
        resolve('异步中调用数据')
	},2000)
    throw new Error('出错了，调用的是reject')
})

从Promise中读取数据。
1. 可以通过Promise的实例方法 then 来读取Promise中存储的数据。
2. then需要两个回调作为参数，回调函数来获取Promise中的数据。
  1. 通过resolve存储的数据，会调用第一函数返回，可以在第一个函数中编写处理数据的代码。
  2. 通过reject存储数据或者出现异常时，会调用第二个函数返回，可以在第二个函数中编写处理异常的代码。
```
                                    
                                      promise.then((result)=>{
    console.log('1',result)
},(reson)=>{
    console.log('2',reason)
})

                                    
                                  
```
Promise中维护了两个隐藏属性:
1. PromiseResult
  1. 用来存储数据
2. PromiseState
  1. 记录Promise的状态（三种状态）
    1. pending （进行中）
    2. fulfilled （完成）通过resolve存储数据时
    3. rejected （拒绝，出错了）出错了或通过reject存储数据时
  2. state只能修改一次，修改以后永远不会在变
3. 流程：
  1. 当Promise创建时，PromiseState初始值为pending
    1. 当通过resolve存储数据时 PromiseState 变为fulfilled(完成)
      1. PromiseResult变为存储的数据
    2. 当通过reject存储数据或出错时 Promise 变为rejected(拒绝)
      1. PromiseResult变为存储的数据或异常对象
  2. 当我们通过then读取数据时，相当于为Promise设置了回调函数
    1. 如果PromiseState变为fulfilled，则调用then的第一个回调函数来返回数据
    2. 如果PromiseState变为rejected。则调用then的第二个回调函数来返回数据
```
                            
                              const promise2 = new Promise((resolve, reject) => {
    resolve("哈哈")
})

// console.log(promise2)
promise2.then(result => {
    console.log(result)
}, reason => {
    console.log("出错了")
})

                            
                          
```

catch() 用法和then类似，但是只需要一个回调函数作为参数。

catch() 中的回调只会在Promise被拒绝时才会调用。
catch() 相当于 then(null, reason=>{}) 。

catch() 就是一个专门处理Promise异常的方法。

                                
                                  promise2.catch(reason => {
    console.log(222222)
})

finally() 。

无论是正常存储数据还是出现异常了，finally总会执行。
但是finally的回调函数中不会接收到数据。

finally()通常用来编写一些无论成功与否都要执行的代码。

                                
                                  promise2.finally(()=>{
    console.log("没有什么能够阻挡我执行的！")
})

3.Promise详解

3.1Promise用法

Promise就是一个用来存储数据对象，但是由于Promise存取的方式的特殊，所以可以直接将异步调用的结果存储到Promise中。

                        
                          function sum(a, b) {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve(a + b)
        }, 1000)
    })
}
//回调地狱式写法：
sum(123, 456).then(result => {
    sum(result, 7).then(result =>{
        sum(result, 8).then(result => {
            console.log(result)
        })
    })
})
//promise写法：
sum(123, 456)
    .then(result => result + 7)
    .then(result => result + 8)
    .then(result => console.log(result))

下来我们就解释一下为什么是这种链式调用的形式

promise中的then方法会返回一个新的Promise ，而我们接收并且输出的是Promise的PromiseResult的值，就像这样： then (return new Promise()) .

Promise中会存储回调函数的返回值，当前的参数是上一个链式调用的返回值。

                        
                          promise
    .then(result => {
        console.log("回调函数", result) 
        return "会作为下个then的参数"
    })
    .then(result => {
        console.log("第二个then", result)  //第二个then，会作为下个then的参数
        return "taotao真快乐"
    })
    .then(result => {
        console.log(result)  //taotao真快乐
    })

promise中的。

then (return new Promise())
catch
这三个方法都会返回一个新的Promise, Promise中会存储回调函数的返回值
finally
1. finally的返回值，不会存储到新的Promise中
对Promise进行链式调用时，后面的方法(then和catch)读取的上一步的执行结果
1. 如果上一步执行结果不是当前想要的结果，则跳过当前的方法，执行下一个方法
2. 一般都把catch写到最后，只写一个，最后统一处理异常
3. 当Promise出现异常时，而整个调用链中没有catch，则异常会向外抛出

3.2Promise静态方法

Promise.resolve() 创建一个立即完成的Promise 。

                                
                                  Promise.resolve('成功调用时的数据').then(
    (result)=>{
        console.log(1111)
    })
//相当于
new Promise((resolve, reject)=>{
	resolve('成功调用时的数据')
}).then(result=>{
	  console.log(1111)
})

Promise.reject() 创建一个立即拒绝的Promise 。

                                
                                  Promise.reject('错误')

Promise.all([...]) 同时返回多个Promise的执行结果。

其中有一个报错，就返回错误。

                                
                                  function sum(a, b){
    return new Promise((resolve, reject)=>{
       setTimeout(()=>{
            resolve(a + b)
       },1000)
	})
}
//传递一个可迭代对象(类数组)
Promise.all(
	sum(111, 222),
    Promise.reject("哈哈"),
    sum(222, 333),
	sum(333, 444)
).then((result)=>{
    console.log(result)  //[ 579, 11, 77 ]
}).catch ((reason)=>{
    console.log(reason)  //'哈哈'
})

Promise.allSettled([...]) 同时返回多个Promise的执行结果(无论成功或失败) 。

{status: 'fulfilled', value: 579} 。
{status: 'rejected', reason: '哈哈'} 。

                                
                                  Promise.allSettled([
    sum(123, 456),
    sum(5, 6),
    Promise.reject("哈哈"),
    sum(33, 44)
]).then(r => {
    console.log(r)
})

//返回的结果如下：
[
  { status: 'fulfilled', value: 579 },
  { status: 'fulfilled', value: 11 },
  { status: 'rejected', reason: '哈哈' },
  { status: 'fulfilled', value: 77 }
]

Promise.race([...]) 返回执行最快的Promise（不考虑对错）。

                                
                                  Promise.race([
    Promise.reject(1111),
    sum(123, 456),
    sum(5, 6),
    sum(33, 44)
]).then(r => {
    console.log(r)
}).catch(r=>{
    console.log(r)
})
//执行结果如下
1111
Promise.reject(1111)，不用等定时器执行结束，直接就调用

Promise.any([...]) 返回执行最快的完成的Promise 。

                                
                                  Promise.any([
    Promise.reject(1111),
    Promise.reject(2222),
    Promise.reject(3333),
]).then(r => {
    console.log(r)
}).catch(r => {
    console.log("错误", r)
})

最后此篇关于Promise知一二的文章就讲到这里了,如果你想了解更多关于Promise知一二的内容请搜索CFSDN的文章或继续浏览相关文章，希望大家以后支持我的博客！。

27

4

0

文章推荐：视频超分之BasicVSR-阅读笔记

文章推荐：观察者模式

文章推荐： [.NET学习]EFCore学习之旅-2简单的增删改查

文章推荐：数据结构高阶--AVL（平衡二叉树）（图解+实现）

promise - 如何从 promise 中退出 promise ？
如何从 promise 中退出 promise ？ perl6 文档没有提供简单的方法。例如: my $x = start { loop { # loop forever until "qui
sql - Sequelize Promises - Chaining Promises 和 Bluebird Promise.each、Promise.map、Promise.all 等
我的用户 Controller 中有一个索引操作，其中我试图连续做两件事，并且在它们都有机会完成之前不执行所需的 res.json() 方法。我有一个加入用户的友谊加入模型。一列是 friender
javascript - 运行序列 promise 之间的区别是创建一个新的 promise 然后运行和创建所有 promise 然后运行每个 promise
请帮我解释一下为什么日志结果有两种不同: 方式 1:每 1 秒顺序记录一次方式 2:1 秒后记录所有元素。 // Way 1 let sequence = Promise.resolve(); [1
javascript - 如何将 Promise 返回到 Promise.all() 中。 Promise.all() 返回一个 Promise
我的问题很简单。 Promise.all() 方法可以返回 Promise 吗？让我解释一下: function simpleFunction() { let queue = [];
javascript - Promise.all 返回 promise 数组的 promise ，但返回单个 promise 的正确值
我正在使用 Promise 从存储中读取文件并转换为 base64 字符串。我有图像数组，使用 RNFS 读取图像 const promise_Images = _Images.map(async (
javascript - Promise.all([]) 返回已解决的 Promise，但 Promise.race([]) 返回待处理的 Promise。为什么它们不同？
如果使用非空数组调用 Promise.all 或 Promise.race，它们将返回一个待处理的 Promise: console.log(Promise.all([1])); // prints
javascript - Promise.all 中的链式 promise ，没有包装器 Promise
Promise.all 是否可以在没有包装 promise 的情况下返回链的最后一个值？如果不使用 await，它在我的上下文中不起作用没有包装的例子: function sum1(x){ r
javascript - promise 的 promise 到简单的 promise ？
我一直在玩 promise，通常能想出如何处理好它们，但在这种情况下，我不知道如何删除一个 promise-wrapping level。代码如下: let promise2 = promise1.
javascript - 如何嵌套 Promise(Promise.all 内的 Promise.all)
考虑以下嵌套的Promises结构: const getData = async() => { const refs = [{ name: "John33", age: 3
javascript - Promise、Promise/A 和 Promise/A+ 之间的区别
我已经阅读了 Promise/A+ 规范，但据我了解，还有诸如 Promise/A 和 Promise 之类的东西。它们之间有什么区别？ Promise 和 Promise/A 规范也是如此吗？如果是
promise - Promise 对象内外的分号
当我运行以下代码时: my $timer = Promise.in(2); my $after = $timer.then({ say "2 seconds are over!"; 'result'
promise - 为什么我不允许破坏 Promise？
以下简单的 promise 是发誓的，我不允许打破它。 my $my_promise = start { loop {} # or sleep x; 'promise re
promise - 扩展ES6中的 promise
我正在尝试扩展Promise: class PersistedPromise extends Promise { } 然后在派生类上调用静态resolve以直接创建一个已解决的Promise: Per
javascript - 如何在调用另一个 promise 之前检查一个 promise 的结果后返回 promise
我有两个返回 promise 的函数，我独立使用它们作为: getLocal().then(...) 和 getWeb().then(...) 但是现在我遇到了一个奇怪的问题: 1) 我需要第三个
javascript - Promise.all 里面的 Promise.all 对于 Promise 来说是一个很好的实践吗？
我不知道 promise.all 解决方案中的 promise.all 是否是一个好的实践。我不确定。我需要从一组用户获取信息，然后通过此信息响应，我需要发送消息通知。 let userList =
javascript - 为什么在第一个 Promise 解析之后执行链式 Promise 后排队的微任务而忽略链式 Promise？
我一直在尝试使用 queueMicrotask() 函数，但我没有弄清楚当回调是微任务时回调的优先级如何。查看以下代码: function tasksAndMicroTasks() { const
javascript - 为什么在第一个 Promise 解析之后执行链式 Promise 后排队的微任务而忽略链式 Promise？
我一直在尝试使用 queueMicrotask() 函数，但我没有弄清楚当回调是微任务时回调的优先级如何。查看以下代码: function tasksAndMicroTasks() { const
promise - Pharo promise :
今年早些时候，我在 Pharo Smalltalk 参与了一个 promise 项目。这个想法是为了实现以下行为: ([ 30 seconds wait. 4 ]promiseValue )then:
javascript - Bluebird Promise.all 在 Promise 链中间捕获并继续 Promise
大家好，提前感谢您的帮助。下面是我正在尝试做的事情 function1(){ throw some error(); } function2() { // dosomething suc
javascript - Node.js Promises in Promises in Promises 中的嵌套回调未解析
我有以下未解析的代码。f2 解决了，所以我不会添加该代码，它是 f1 我有问题。我调用函数，它到达最里面如果，它调用函数“find”，它执行函数 findId，完美返回 Id，然后执行 editId

首页

博学

6Ren·AI

商城