zoukankan      html  css  js  c++  java
  • 困惑我多时的Promise和async与await

    promise一直不知道他有什么用看了很多文章都是说解决回调地狱的好方法

    那我们来看看他怎么用吧

    一、 Promise对象有三种状态,他们分别是:

    • pending: 等待中,或者进行中,表示还没有得到结果
    • resolved(Fulfilled): 已经完成,表示得到了我们想要的结果,可以继续往下执行
    • rejected: 也表示得到结果,但是由于结果并非我们所愿,因此拒绝执行

    这三种状态不受外界影响,而且状态只能从pending改变为resolved或者rejected,并且不可逆。在Promise对象的构造函数中,将一个函数作为第一个参数。而这个函数,就是用来处理Promise的状态变化。

    new Promise(function(resolve, reject) {
        if(true) { resolve() };
        if(false) { reject() };
    })

    上面的resolve和reject都为一个函数,他们的作用分别是将状态修改为resolved和rejected。

    二、 Promise对象中的then方法,可以接收构造函数中处理的状态变化,并分别对应执行。then方法有2个参数,第一个函数接收resolved状态的执行,第二个参数接收reject状态的执行。

    function fn(num) {
        return new Promise(function(resolve, reject) {
            if (typeof num == 'number') {
                resolve();
            } else {
                reject();
            }
        }).then(function() {
            console.log('参数是一个number值');
        }, function() {
            console.log('参数不是一个number值');
        })
    }
    
    fn('hahha');
    fn(1234);

    then方法的执行结果也会返回一个Promise对象。因此我们可以进行then的链式执行,这也是解决回调地狱的主要方式。

    谢谢https://www.jianshu.com/p/fe5f173276bd提供的案例

    下面我来通俗易懂的讲一下吧

    就是这么简单

    后期更新async与await

    好久不见,很久没有更新博园了

    最近完善一下async和await

    我们看到了async的返回的是一个promise 对象,如果要获取到promise 返回值,我们应该用then 方法

     

    你看是不是就出来了

    好,那我们来看看他怎么和await配合吧

    这里可以看到yibu返回的是一个promise

    然而我们要知道await必选要在async函数里面才能使用

    那为什么startest里面会有try catch呢

    这是为了捕获promise的resolve

    当我们yibu的参数填1的时候过两秒控制台就会打印“你好”

    没错就是这么简单

  • 相关阅读:
    threejs学习笔记01
    vue.nextTick()----(转)
    vue过滤器---123过滤成一二三
    太懒了,八百年没更新了。。。
    ie上 th td边框不显示
    简案快审----pdf.js使用总结
    201707问题记录
    echarts使用总结
    linux常见漏洞利用技术实践
    remote KG
  • 原文地址:https://www.cnblogs.com/july-lin/p/9685785.html
Copyright © 2011-2022 走看看