• promise的使用


    前端开发过程中会有很多异步产生,有时要拿到异步里的数据的情况,如何解决呢?
    ES6中就提供了一个解决异步的方法,就是promise。

    什么是promise

    简单来说就是一个容器,里面保存着某个未来才会结束的事件(也就是异步操作)的结果。从语法上来讲,Promise是一个对象,从它可以获取异步操作的消息,它提供统一的API,各种异步操作都可以用同样的方法进行处理。

    promise的特点

    1.1.1、对象的状态不受外界影响。Promise对象代表一个异步操作,有三种状态:pending(进行中)、fulfilled(已成功)和 rejected(已失败)。只有异步操作的结果,可以决定当前是哪一种状态、任何其他操作都无法改版这个状态。

    1.1.2、一旦状态改版,就不会再变,任何时候都可以得到这个结果。Promise对象的状态改变,只存在两种可能:从 pending 变为 fulfilled 和 从 pending 变为 rejeced。只要这两种情况发生,状态就终止,不会再变了并一直保持这个结果。这时就称为 resolved(已定型)。如果改版已经发生了,即使再对Promise对象添加回调函数,也会立即得到这个结果。如果你错过了再想去监听,是得不到结果的。

    1.1.3、有了Promise对象,就可以将异步操作以同步操作的流程显示出来,这样就避免了层层嵌套的回调函数。Promise对象提供统一的接口,使得控制异步操作更加容易。

    1.1.4、Promise也有一些缺点,就是无法取消 Promise,一旦建立就会立即执行,无法中途取消。如果不设置回调函数,Promise内部抛出的错误不会反应到外部。另外如果处于 pending 状态时,是无法知道现在到了哪一个阶段。

    基本用法

    Promise对象是一个构造函数,用来生成Promise实例

    const promise = new Promise((reolve, reject) => {
        if (// 异步操作成功) {
            resolve(val)
        }else{
            reject(val)
        }
    })
    

    Promise 构造函数接受一个函数作为参数,该函数的两个参数分别是 resolve 和 reject。

    resolve:,将Promise对象的状态从『未完成』变为『成功』(pending => resolved),在异步操作成功时调用,并将异步操作的结果作为参数传递出去。

    reject:将Promise对象的状态从『未完成』变为『失败』(pending => rejected),在异步操作失败时调用,并将异步操作的结果作为参数传递出去。

    Promise 实例生成以后,可以用 then 方法分别指定 resolved 状态和 rejected 状态的回调函数。

    promise.then((val) => {
        // success
    },(err) => {
        // failure
    })
    

    then方法可以接受两个回调函数作为参数。(第二个函数可选,这两个函数都接受Promise对象传出的值作为参数)

    1、第一个回调函数在Promise对象的状态变为『resolved』时调用。

    2、第二个回调函数在Promise对象的状态变为『rejected』时调用。

    实例:
    
    function timeout(ms) {
        retrun new Promise((resolve, reject) => {
            setTimeout(resolve, ms, 'done')
        })
    }
    
    timeout(100)
    .then((v) => {
        console.log(v)
    })
    

    上面代码中,timeout方法返回一个Promise实例,表示一段时间以后才会发生的结果,过了 ms时间后,Promise状态变为『resolved』然后就会触发then方法绑定的回调函数。

    Promise 建立后就会立即执行

    let promise = new Promise((resolve, reject) => {
        console.log('Promise')
        resolve()
    })
    
    promise
    .then(() => {
        console.log('resolved')
    })
    
    console.log('hh')
    

    Promise建立后立即执行,首先输出 「Promise」然后执行promise 的then函数,然后首先执行同步任务 输出 hh 在执行 then方法的回调函数输出resolved

    如果调用 resolve 函数和 reject 函数时带有参数,那么它们的参数会被传递给回调函数。reject函数的参数通常是Error对象的实例,表示抛出的错误。resolve函数的参数除了正常的值以外,还有可能是一个Promise实例。resolve实在成功的时候调用,reject是在失败的时候调用。

    const p1 = new Promise(function (resolve, reject) {
      // ...
    });
    
    const p2 = new Promise(function (resolve, reject) {
      // ...
      resolve(p1);
    })
    

    上述代码中:p1 和 p2都是Promise的实例,但是p2的 resolve方法将 p1作为参数,即一个异步操作的结果返回是另一个异步操作。

    注意:p1的状态就会传递给p2,p1的状态决定了p2的状态。如果p1的状态是pending,那么p2的回调函数就会等待p1的状态改变;如果p1的状态已经是 resolved 或者 rejected,那么p2的回调函数会立即执行。

    一般来说,调用resolve 或 reject以后,Promise的进程就就结束了,后续操作应该放到 then方法里,而不是直接写在 resolve 或 reject 的后面。另外最后在它们之前加上 return语句。

  • 相关阅读:
    C语言知识
    Java课程设计——个人
    Java大作业
    DAO模式代码阅读及应用
    有理数设计
    泛型 -Java
    集合框架之ArrayList -Java
    图总结
    树、二叉树、查找算法总结
    编辑器、编译器、文件、IDE等常见概念辨析
  • 原文地址:https://www.cnblogs.com/ruo-shui-yi-fang/p/11676780.html
Copyright © 2020-2023  润新知