js中的promise(js中的json对象)

http://www.itjxue.com  2023-02-18 05:26  来源:未知  点击次数: 

【Flutter】利用Future封装出js中的Promise

前端的同学对 Promise 肯定都很熟悉,而 Future 便是 dart 中 Promise ,但方法名称和使用方式还是有些许的差异的。

下面我们尝试,利用 Future 封装出js中我们熟悉的 Promise 。

使用示例

Promise.all , Promise.race , Promise.resolve , Promise.reject

Promise.allSettled 方法接受一组 Promise 实例作为参数,包装成一个新的 Promise 实例。只有等到所有这些参数实例都返回结果,不管是 fulfilled 还是 rejected ,包装实例才会结束。该方法由 ES2020 引入

Promise.any() 方法接受一组 Promise 实例作为参数,包装成一个新的 Promise 实例。只要参数实例有一个变成 fulfilled 状态,包装实例就会变成 fulfilled 状态;如果所有参数实例都变成 rejected 状态,包装实例就会变成 rejected 状态。该方法目前是一个第三阶段的 提案 。

Promise.any() 跟 Promise.race() 方法很像,只有一点不同,就是不会因为某个 Promise 变成 rejected 状态而结束。

顺便把 延迟函数 也封装一下,毕竟毫秒延迟的使用频率是最高的。

js中promise到底怎么用

我举个生活中的例子吧,比如说你去麦当劳买吃的,你下订单后,会给你一个小纸条,这个小纸条相当于你和麦当劳之间的约定,这个小纸条也可以理解为你所定的餐的一个占位符。等麦当劳饭做好了的时候,会吧饭送到你面前,并且把小纸条收走。

这个如果在代码中的话,就意味着,你在执行代码的时候,可能会在未来某个时刻才会取到值(异步),等在值取到以后,会进行一些相应的处理,比如说ajax,这实际上就是promise的一个典型的应用场景。

我刚刚只是说了promise的一个大的应用场景,我觉得只要能把握住这个,具体的API就可以了。

假如你想对它的使用有一个更深入的了解的话,我还可以推荐你一个小文章: Javascript基础之-Promise

加油

js的promise如何递归调用?

递归是Promise机制的核心之一:then方法返回另一个promise2,其内容是由回调方法的返回值决定的;回调中可以返回promise3,使外面的promise2的内容成为promise3的内容,也就是说,如果要用promise来递归,只需要在then回调中返回递归promise即可

举例如下:

//假如用jQuery

function get(url, p) {

return $.get(url + "?page=" + p)

.then(function(data) {

if(!data.list.length) {//递归结束条件

return [];

}

return get(url, p+1)//递归调用

.then(function(nextList) {

return [].concat(data.list, nextList);//合并递归内容

});

});

}

get("urlurl", 1).then(function(list) {

console.log(list);//your full list is here

});

js Promise 等待多个异步操作执行完再去做一些操作

在我们的程序中有些操作是需要等到一些接口的数据返回之后才能做的操作

比如我们在一个页面需要发送好几个请求,这几个请求都发送完了我们再去隐藏 loading效果,一开始我是这样操作的:

执行效果:

只是返回了 失败回调,这显然不是我们想要的效果

但是,我们写好的时候,使用 Promise.all()方法的时候,想起来,Promise.all()这个方法,只要这个方法的任意一个 promise有reject也就是失败状态的时候,promise 不管剩余的其他的promise 是否完成,就会停止当前的监听,那就有可能丢失当前的 其他请求的状态和结果,所以我们在写的时候,就应该考虑,我们当前promise的执行权是不是应该交给当前单个promise的回调具体应该怎么操作呢

执行效果:

然后我们判断,返回结果的 数组的长度是否等于传入数组的长度,就能知道请求是发送完成了(不管请求结果是怎样);

完!!

原生JS模拟Promise实现详解

作为一名程序猿,经常遇到回调函数的情况,原生js的回调函数是一层一层的嵌套调用,而es6提供了一种新的写法,Promise,它可以把原本的嵌套回调函数实现成横向的调用,即链式调用。

下面看一个Promise的简单用法:

接着开始模拟:

首先,_Promise构造函数会接收一个函数resolver并执行,函数中又包含resolve和reject两个参数,然后,_Promise构造函数生成的实例有三种状态,分别是pending(初始值)、fullfilled(成功)和rejected(失败),且由pending变为成功或者失败后状态不可逆。

resolve和reject函数执行的时候会先判断状态,如果是pending则执行,且将状态变为fullfilled或者rejected,并将resolve/reject函数中参数传递给_result,以便then函数调用时使用。

因为有可能存在链式调用,所以执行then函数的返回值需要判断,如果isResolve或者isReject函数返回的是一个新的_Promise实例,则返回这个实例,否则返回当前实例

至此,Promise已经模拟完成~

js中promise在什么场景用?

有若干个异步任务,需要先做任务1,如果成功后再做任务2,任何任务失败则不再继续并执行错误处理函数。

要串行执行这样的异步任务,不用Promise需要写一层一层的嵌套代码。有了Promise,我们只需要简单地写:

job1.then(job2).then(job3).catch(handleError);

请采纳

(责任编辑:IT教学网)

更多

推荐淘宝营销文章