promise me,一定要学会手写一个Promise(四)

最新推荐文章于 2024-05-23 23:33:04 发布
最新推荐文章于 2024-05-23 23:33:04 发布
阅读量370 收藏
点赞数
分类专栏： javascript promise 文章标签： javascript promise
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/hello_yajing/article/details/123500649
版权

一、Promise API

1.  resolve方法

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>resolve和reject</title>
</head>

<body>
    <script>
        /*
            传入的参数为非promise对象，则返回一个状态为成功的promise对象
            传入的参数为promise对象，则，参数的结果决定了resolve的结果
        */
        let promise1 = Promise.resolve(new Promise((resolve, reject) => {
            // resolve('success');
            reject('fail')
        }));//传入：123
        console.log(promise1);
    </script>
</body>

</html>

2.  reject方法

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>resolve和reject</title>
</head>

<body>
    <script>
        /*
            传入的参数为非promise对象，则返回一个状态为失败的promise对象
            传入的参数为promise对象，则，参数的结果决定了reject的结果
        */
        
        let promise2 = Promise.reject(new Promise((resolve, reject) => {
            resolve('success');
        }));//11
        console.log(promise2);
     
    </script>
</body>

</html>

3.  all方法

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>resolve和reject</title>
</head>

<body>
    <script>
        // 参数：  一个数组
        // 返回值：所有Promise都成功，状态才是成功，只要有一个是失败，就为失败。
        let arr = [
            new Promise((resolve, reject) => {
                setTimeout(() => {
                    resolve('success');
                }, 1)
            }),
            new Promise((resolve, reject) => {
                // resolve('success');
                reject('fail');
            }),
            new Promise((resolve, reject) => {
                resolve('success');
            })];
        let promise4 = Promise.all(arr);
        console.log(promise4);
    </script>
</body>

</html>

4.  race方法

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>resolve和reject</title>
</head>

<body>
    <script>
        // 参数为数组，返回值为第一个promise的状态即为最终状态
        let arr = [
            new Promise((resolve, reject) => {
                setTimeout(() => {
                    resolve('success');
                }, 1)
            }),
            new Promise((resolve, reject) => {
                // resolve('success');
                reject('fail');
            }),
            new Promise((resolve, reject) => {
                resolve('success');
         })];


        let promise3 = Promise.race(arr);
        console.log(promise3);
        // apply bind call
    </script>
</body>

</html>

hello_yajing
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
JS手写一个自定义Promise操作示例
11-21
本文实例讲述了JS手写一个自定义Promise操作。分享给大家供大家参考，具体如下： 经常在面试题中会看到，让你实现一个Promsie,或者问你实现Promise的原理，所以今天就尝试利用class类的形式来实现一个Promise 为了不...
【JavaScript】必须要会的手写Promise
Alberqing_的博客
04-27 283
写在前面Promise是ES6中核心的语法，也是面试最常问的一部分，所以搞懂它的执行规则是必须，学会手写会让你在面试中脱颖而出，迈出拿到offer坚实的一步～在之前的文章中，我翻译了Pr...
promise me,一定要学会手写一个Promise(一)
hello_yajing的博客
03-14 1216
从b站看了尚硅谷的Promise课程，讲的非常好。所以总结以下加深记忆~~~
promise me,一定要学会手写一个Promise(六)
hello_yajing的博客
03-15 452
一、手写Promise方法 实现Promise的构造器方法 function Promise(excutor) { // 添加属性 this.PromiseState = 'pending'; this.PromiseResult = null; this.callbacks = [];// 为了多个then链式调用,保存then方法中传入的回调函数 //保存实例对象的this的值 const self = this; function re
promise me,一定要学会手写一个Promise(二)
hello_yajing的博客
03-14 1115
这一节我们一起来体验一下Promise的基本使用~~
promise me,一定要学会手写一个Promise(三)
hello_yajing的博客
03-15 122
一、使用Promise封装ajax请求 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"&g
promise me,一定要学会手写一个Promise(五)
hello_yajing的博客
03-15 474
一、指定回调和修改状态的执行顺序 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
promise me,一定要学会手写一个Promise(七)
hello_yajing的博客
03-15 137
将函数的Promise改为class类型的 class Promise { constructor() { // 添加属性 this.PromiseState = 'pending'; this.PromiseResult = null; this.callbacks = [];// 为了多个then链式调用,保存then方法中的参数 //保存实例对象的this的值 const self = thi
手写一个promise用法_JavaScript进阶之手写Promise
weixin_30722051的博客
12-31 246
前言Promise异步编程的一种解决方案，比传统的解决方案——回调函数和事件——更合理和更强大。它由社区最早提出和实现，ES6 将其写进了语言标准，统一了用法，原生提供了Promise对象。这里手写一次，希望能和大家一起彻底掌握Promise。概述所谓Promise，简单说就是一个容器，里面保存着某个未来才会结束的事件(通常是一个异步操作)的结果。从语法上说，Promise 是一个对象，从它可以获...
JavaScript进阶之手写Promise
站在原型链顶端的男人
07-05 583
前言 Promise异步编程的一种解决方案，比传统的解决方案——回调函数和事件——更合理和更强大。它由社区最早提出和实现，ES6 将其写进了语言标准，统一了用法，原生提供了Promise对象。这里手写一次，希望能和大家一起彻底掌握Promise。 概述 所谓Promise，简单说就是一个容器，里面保存着某个未来才会结束的事件（通常是一个异步操作）的结果。从语法上说，Promise 是一个...
如何从零开始利用js手写一个Promise库详解
10-18
ES2015 推出了JS 的 Promise ，而在没有原生支持的时候，我们也可以使用诸如 Promises/A+ 的库的帮助，在我们的代码里实现Promise 的支持，下面这篇文章主要给大家介绍了如何从零开始利用js手写一个Promise库的相关...
Promise_js手写promise_js手写Promise_手写Promise_JS手写Promise_
09-30
原生js手写Promise
ant design DatePicker日期选择框指定分钟的间隔minuteStep属性
u010234868的专栏
05-17 228
在上面的例子中，DatePicker 将只允许用户以 15 分钟为间隔选择分钟。是 Ant Design 的 TimePicker时间选择框组件的一个属性。设置为 30，则用户可以选择以 30 分钟为间隔的分钟值。如果你想让分钟选项只能以 15 分钟为间隔选择，你可以将。
【详细介绍WebKit的结构】
最新发布
cz88888888666的博客
05-23 378
WebKit是一个开源的浏览器引擎，主要用于渲染网页内容，它最初由苹果公司为其Safari浏览器开发，目前被多种浏览器和应用程序使用，包括所有基于iOS和macOS的浏览器，WebKit的设计目标是提供快速、精准且流畅的网页浏览体验。
深入解析：Element Plus 与 Vite、Nuxt、Laravel 的结合使用
一个普通人
05-23 602
Element Plus 作为一个强大的 Vue.js 组件库，可以与 Vite、Nuxt 和 Laravel 等不同的工具和框架结合使用，为开发者提供灵活、高效的开发体验。根据项目需求选择合适的工具和框架，可以极大地提升开发效率和应用性能
js知识点汇总之let const 和 var的区别
fyw1789的博客
05-23 1061
声明的变量会先在作用域中被创建出来，但因此时还未进行词法绑定，所以是不能被访问的，如果访问就会抛出错误。因此，在这运行流程进入作用域创建变量，到变量可以被访问之间的这一段时间，就称之为暂时死区。其实上面不存在变量提升的例子中，其实也是暂时性死区，因为它有暂时性死区的概念，所以它压根就不存在变量提升了。实际上保证的，并不是变量的值不得改动，而是变量指向的那个内存地址所保存的数据不得改动。中的作用域有：全局作用域、函数作用域，命令声明变量之前，该变量都是不可用的。，导致绑定这个块级作用域，
React函数式组件的父子方法互相调用，父组件调用子组件方法，子组件调用父组件方法
SongZhengxing_的博客
05-18 234
子组件需要使用 forwardRef 函数包裹，然后使用 useImperativeHandle 暴露属性和方法。编写子组件 Child。
TS中的InstanceType函数和Typeof 操作符
05-23 84
【vue中的instanceType用法】父组件用ref获取子组件时，通过 instanceType获取子组件的类型。此外，typeof 操作符除了可以获取对象的结构类型之外，它也可以用来获取函数对象的类型。尽管ES6引入了更清晰的类语法，但从类型检查的角度看，类仍然被视为函数。函数：该函数返回（构造） 由某个构造函数构造出来的实例类型组成的类型。操作符除了可以获取对象的结构类型之外，它也可以用来获取函数对象的类型。获取由某个构造函数构造出来的实例类型组成的类型。操作符可以用来获取一个变量或对象的类型。
手写一个promise
03-20
很高兴为您提供一个手写的 Promise 实现，代码如下： class Promise { constructor(executor) { this.state = 'pending'; this.value = undefined; this.reason = undefined; this.onResolvedCallbacks = []; ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值