ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

Promise学习

2021-06-19 23:02:08  阅读:153  来源: 互联网

标签:resolve console log 学习 let reject Promise


文章目录

Promise的理解

什么是Promise

Promise是JS解决异步编程的新的解决方案。
Promise是一个构造函数,promise对象对异步操作以及获取的结果进行封装。

Promise的状态

  1. pending 变为 fulfilled,表示成功
  2. pending 变为 rejected,表示失败

Promise的状态改变只有这两种,不能从fulfilled 变为 pending,也不能从fulfilled变为rejected,因此一个Promise对象的状态只能改变一次。

无论是成功还是失败,最后都会返回一个数据,成功时返回data数据,失败时返回error数据。
 
 
 

Promise的使用

在这里插入图片描述

		// 1.创建promise对象
        const p = new Promie((resolve, reject) => {
            // 2.异步操作

            // 3.1成功执行异步操作执行resolve(),接受data参数
            resolve(data);

            // 3.2失败执行异步操作执行reject(),接受error参数
            reject(eror);
        })

       // 第一个参数为成功执行resolve()后调用的回调函数
       // 第二个参数为成功执行reject()后调用的回调函数
       p.then(data => {}, error => {})

如果时间戳为偶数则成功,奇数则失败:

		// 1.创建promise对象
        const p = new Promise((resolve, reject) => {
                // 2.执行异步任务
                setTimeout(() => {
                    const timer = Date.now()
                        // 3.1成功时调用resolve函数
                    if (timer % 2 === 0) {
                        resolve('芜湖成功!' + timer);
                    }
                    // 3.2失败时调用reject函数
                    else {
                        reject('多捞哦' + timer)
                    }
                }, 1500);
            })
            // 4.调用成功 / 失败的回调函数
        p.then(
            // 接受得到成功的value
            data => {
                console.log('成功的回调', data);
            },
            // 接收得到失败的error
            error => {
                console.log('失败的回调', error);

            })

在这里插入图片描述
在这里插入图片描述
 
 

resolve方法

Promise.resolve(value)

参数value可以是Promise对象,也可以是其他类型数据
当value是Promise对象时,Promise对象的结果决定了resolve()的结果

        let p1 = Promise.resolve(new Promise((resolve, reject) => {
            resolve('芜湖!!')
        }))
        console.log(p1)

        let p2 = Promise.resolve(new Promise((resolve, reject) => {
            reject('多捞哦')
        }))
        console.log(p2);
        p2.catch(error => {
            console.log(error);
        })

对于p1来说,promise对象作为参数时,结果是成功的,所以resolve的结果也是成功的fulfilled
而p2,promise对象的结果是失败的,所以resolve的结果也是失败的rejected
在这里插入图片描述
而当参数为非promise对象时,返回的都是成功的promise对象

		let p3 = Promise.resolve({
            name: 'pyy'
        });
        let p4 = Promise.resolve(() => {});
        let p5 = Promise.resolve('彭于晏')
        console.log(p3);
        console.log(p4);
        console.log(p5);

在这里插入图片描述
 
 

reject方法

Promise.reject(error)

reject的error无论是什么类型的参数,reject返回的结果永远都是失败的,而且传入的参数是什么,失败返回的结果就是什么。

		let p1 = Promise.reject('pyy')
        let p2 = Promise.reject({})
        let p3 = Promise.reject(() => {})
        console.log(p1);
        console.log(p2);
        console.log(p3);
        p1.catch(error => {})
        p2.catch(error => {})
        p3.catch(error => {})

        let p4 = Promise.reject(new Promise((resolve, reject) => {
            resolve('芜湖')
        }))
        console.log(p4);
        p4.catch(error => {})

在这里插入图片描述
 
 

all方法

Promise.all([])

all方法接受一个 元素都是Promise对象组成的数组 作为参数。

当数组的每一个promise对象结果都是成功,all方法返回的结果就是成功的,而且返回的内容就是每一个promise对象的结果值。

		let p1 = Promise.resolve('芜湖!')
        let p2 = Promise.resolve('起飞!')
        let p3 = Promise.resolve('全体起立!')
        const result = Promise.all([p1, p2, p3])
        console.log(result);

在这里插入图片描述

当数组中有失败的promise对象时,all方法返回的结果就是失败的,而且返回的内容就是失败的promise对象的结果值。

		let p1 = Promise.resolve('芜湖!')
        let p2 = Promise.resolve('起飞')
        let p3 = Promise.reject('超逊的')
        const result = Promise.all([p1, p2, p3])
        console.log(result);

在这里插入图片描述
 
 

race方法

race()方法接受的参数和all一样,也是由promise对象组成的数组,但是race方法返回的结果取决于第一个改变状态的promise对象。

		let p1 = Promise.resolve('芜湖!')
        let p2 = Promise.resolve('起飞')
        let p3 = Promise.reject('超逊的')
        const result = Promise.race([p1, p2, p3])
        // p1首先改变状态
        console.log(result);

在这里插入图片描述

		let p1 = Promise.resolve(new Promise((resolve, reject) => {
            setTimeout(() => {
                resolve('芜湖')
            }, 1000);
        }))
        let p2 = Promise.reject('起飞')
        let p3 = Promise.reject('超逊的')
        const result = Promise.race([p1, p2, p3])
        // p2首先改变状态
        console.log(result);

在这里插入图片描述

标签:resolve,console,log,学习,let,reject,Promise
来源: https://blog.csdn.net/weixin_46647170/article/details/118049603

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有