学习记录_0911

最新推荐文章于 2024-09-19 10:09:37 发布

vigorZ

最新推荐文章于 2024-09-19 10:09:37 发布

阅读量52

点赞数

本文链接：https://blog.csdn.net/vigorZ/article/details/108513562

版权

面试精选之Promise

https://juejin.im/post/6844903625609707534

Promise出现原因：
在出现promise前，处理异步网络请求：

// 需要根据一个网络的请求结果 再去指向下一个网络请求
请求1(function(请求结果1){
    请求2(function(请求结果2){
        请求3(function(请求结果3){
            请求4(function(请求结果4){
                请求5(function(请求结果5){
                    请求6(function(请求结果3){
                        ...
                    })
                })
            })
        })
    })
})

回调地狱副作用：

代码臃肿
可读性差
耦合度过高，可维护性差
代码复用性差
容易产生bug
只能在回调里处理异常

什么是Promise

Promise是异步编程的一种解决方案，比传统的异步解决方案【回调函数】【事件】更加合理、更强大。
常规写法：

new Promise(请求1)
	.then(请求2(请求结果1))
	.then(请求3(请求结果2))
	.then(请求4(请求结果3))
	.then(请求5(请求结果4))
	.catch(处理异常(异常信息))
// 更加直观并且能在外层捕获异步函数的异常信息

API

Promise.resolve(value)

类方法，返回一个以value值解析后的Promise对象。1、如果这个值是个thenable（带有then方法），返回的Promise对象会“跟随”这个thenable的对象，采用他的最终状态（resolved/rejected/pending/settled）
2、如果传入的value本身就是Promise对象，则该对象作为Promise.resolve方法的返回值返回
3、其他情况以该值为成功状态返回一个Promise对象

// 如果传入的value本身就是Promise对象，则该对象作为 Promise.resolve方法的返回值返回
function fn(resolve){
	setTimeout(function (){
		resolve(123)
	},3000)
}
let p0 = new Promise(fn)
let p1 = Pronise.resolve(p0)
console.log(p0 === p1)  //  返回true

传入 thenable 对象，返回promise对象跟随 thenable对象的最终状态。

//  如果传入的value本身就是thenable对象，返回的promise对象会跟随 thenable对象的状态。
let promise = Promise.resolve($.ajax('/text/text.json'))  //  =>promise对象
promise.then(function(value){
	console.log(value)
})  //  返回一个状态已变成resolved的Promise对象
let p1 = Promise.seolve(123)
console.log(p1) //  p1是一个状态置为resolved的Promise对象

Promise.reject(value)

类方法，与resolve唯一的不同是，返回的promise对象状态为rejected

Promise.prototype.then

实例方法，为Promise注册回调函数，函数形式：fn(value){},value是上一个任务的返回结果，then中的函数一定要return一个结果或者新的Promise对象，才可以让之后的then回调接收

Promise.prototype.catch

实例方法，捕获异常，函数形式：fn(err){},err是catch注册之前的回调抛出的异常信息。

Promise.race

类方法，多个Promise同时执行。返回最先执行结束的 Promise 任务的结果，不管这个Promise结果是成功还是失败。

Promise.all

类方法，多个Promise同时执行。如果全部执行成功，则以数组的方式返回所有Promise任务的执行结果。如果有一个Promise任务rejected，则只返回rejected任务的结果。

理解 Promise

先去超市买菜。
用超市买回来的菜做饭。
将做好的饭菜送到单位。
送到单位后打电话通知我。

//  上面三步都是需要消耗时间的，我们可以理解为三个异步任务
function 买菜(resolve,reject) {
	setTimeout(function() {
		resolve(['西红柿'、'鸡蛋'、'油菜'])
	},3000)
}
function 做饭(resolve, reject){
    setTimeout(function(){
        //对做好的饭进行下一步处理。
        resolve ({
            主食: '米饭',
            菜: ['西红柿炒鸡蛋'、'清炒油菜']
        })
    },3000) 
}
function 送饭(resolve，reject){
    //对送饭的结果进行下一步处理
    resolve('辛苦');
}
function 电话通知我(){
    //电话通知我后的下一步处理
    给保姆加100块钱奖金;
}

// 告诉保姆帮我做几件连贯的事情，先去超市买菜
new Promise(买菜)
//用买好的菜做饭
.then((买好的菜)=>{
    return new Promise(做饭);
})
//把做好的饭送到公司
.then((做好的饭)=>{
    return new Promise(送饭);
})
//送完饭后打电话通知我
.then((送饭结果)=>{
    电话通知我();
})

总结：

后续任务是异步任务的话，必须return一个新的promise对象
如果后续任务是同步任务，只需return一个结果就好

一个Promise对象有三种状态，并且状态一旦改变，便不能再更改为其他状态

pending，异步任务正在进行。
resolved (也可以叫fulfilled)，异步任务执行成功。
rejected，异步任务执行失败。

使用Promise总结

首先初始化一个Promise对象，可以通过两种方式创建，这两种方式都会返回一个promise对象
new Promise（fn）
Promise.resolve（fn）
然后调用上一步返回的 promise 对象的 then 方法，注册回调函数
then 中的回调函数可以有一个参数，也可以不带参数。如果 then 中的回调函数依赖上一步的返回结果，那么要带上参数。