美文网首页
2020-10-28promise(四)

2020-10-28promise(四)

作者: 夏天的风2020 | 来源:发表于2020-10-29 10:04 被阅读0次

ES6 Promise 先拉出来遛遛

复杂的概念先不讲,我们先简单粗暴地把Promise用一下,有个直观感受。那么第一个问题来了,Promise是什么玩意呢?是一个类?对象?数组?函数?


别猜了,直接打印出来看看吧,console.dir(Promise),就这么简单粗暴。


这里写图片描述

这么一看就明白了,Promise是一个构造函数,自己身上有all、reject、resolve这几个眼熟的方法,原型上有then、catch等同样很眼熟的方法。这么说用Promise new出来的对象肯定就有then、catch方法喽,没错。

那就new一个玩玩吧。

var p = new Promise(function(resolve, reject){
    //做一些异步操作
    setTimeout(function(){
        console.log('执行完成');
        resolve('随便什么数据');
    }, 2000);
});

Promise的构造函数接收一个参数,是函数,并且传入两个参数:resolve,reject,分别表示异步操作执行成功后的回调函数和异步操作执行失败后的回调函数。其实这里用“成功”和“失败”来描述并不准确,按照标准来讲,resolve是将Promise的状态置为fullfiled,reject是将Promise的状态置为rejected。不过在我们开始阶段可以先这么理解,后面再细究概念。

在上面的代码中,我们执行了一个异步操作,也就是setTimeout,2秒后,输出“执行完成”,并且调用resolve方法。

运行代码,会在2秒后输出“执行完成”。
注意!
我只是new了一个对象,并没有调用它,我们传进去的函数就已经执行了,
这是需要注意的一个细节。
所以我们用Promise的时候一般是包在一个函数中,在需要的时候去运行这个函数,如:
function runAsync(){
    var p = new Promise(function(resolve, reject){
        //做一些异步操作
        setTimeout(function(){
            console.log('执行完成');
            resolve('随便什么数据');
        }, 2000);
    });
    return p;            
}
runAsync()

这时候你应该有两个疑问:1.包装这么一个函数有毛线用?2.resolve(‘随便什么数据’);这是干毛的?

我们继续来讲。在我们包装好的函数最后,会return出Promise对象,也就是说,执行这个函数我们得到了一个Promise对象。还记得Promise对象上有then、catch方法吧?这就是强大之处了,看下面的代码:

runAsync().then(function(data){
    console.log(data);
    //后面可以用传过来的数据做些其他操作
    //......
});

在runAsync()的返回上直接调用then方法,then接收一个参数,是函数,并且会拿到我们在runAsync中调用resolve时传的的参数。运行这段代码,会在2秒后输出“执行完成”,紧接着输出“随便什么数据”。

这时候你应该有所领悟了,原来then里面的函数就跟我们平时的回调函数一个意思,能够在runAsync这个异步任务执行完成之后被执行。这就是Promise的作用了,简单来讲,就是能把原来的回调写法分离出来,在异步操作执行完后,用链式调用的方式执行回调函数。

相关文章

  • 2020-10-28promise(四)

    ES6 Promise 先拉出来遛遛 复杂的概念先不讲,我们先简单粗暴地把Promise用一下,有个直观感受。那么...

  • 2020-10-28promise(三)

    概述 Promise对象: 代表了未来某个将要发生的事件(通常是一个异步操作)。 ES6中的promise对象, ...

  • 2020-10-28promise(二)

    异步操作前置知识jS是单线程的就是同一时间只能处理一个任务。就类似生活中的去超市排队结账,正常情况下,以为收银员只...

  • 四郎四郎傅四郎(四)

    上一章-南城(三) 第二章•无头女婴(一) 聚园柳庄内一私人别墅。 “四个,这是刚刚丁探长让人整理的和9...

  • 四(四)资源

    资源在MQL4程序中使用图形和声音 MQL4中的程序允许处理声音和图形文件:PlaySound() // 播放声...

  • 小 四 (四)

    这一次见面过后,又好多年没有见过小四。但是她三十岁那年,听到家里人又谈起了小四。 小四前两年又生了个女儿。由于她生...

  • 四幺四

    四月十四日,我想起了大学宿舍里面的扑克游戏四幺四,当时风靡整个后楼二十二系势力范围,一时“不会四幺四,人缘肯定次”...

  • 四苦 四醒 四行 四喜 四悲 四得(经典!)

    人生四苦 一苦:看不透 看不透人际中的纠结,争斗后的隐伤 看不透喧嚣中的平淡,繁华后的宁静 二苦:舍不得 舍不得曾...

  • 四人 · 四城 · 四时 · 四地

    四人 · 四城 · 四时 · 四地 由于工作和生活的原因,四个闺密的开始四地分隔生活,不一样的生活环境,不尽相同的...

  • 四郎四郎傅四郎

    契子 你有没有试过 掏心掏肺的爱一个人 嫉妒他对另一个人的好 却在他厌恶自己的那一刻 才发现 原来自己...

网友评论

      本文标题:2020-10-28promise(四)

      本文链接:https://www.haomeiwen.com/subject/vfrcvktx.html