zoukankan      html  css  js  c++  java
  • JavaScript异步与Promise基本用法(resolve与reject)

    Promise的基本用法

    new Promise( function(resolve, reject) {...} ); //reject参数 可不选

    executor

    executor是带有 resolve 和 reject 两个参数的函数 。Promise构造函数执行时立即调用executor 函数, resolve 和 reject 两个函数作为参数传递给executor(executor 函数在Promise构造函数返回新建对象前被调用)。resolve 和 reject 函数被调用时,分别将promise的状态改为fulfilled(完成)或rejected(失败)。executor 内部通常会执行一些异步操作,一旦完成,可以调用resolve函数来将promise状态改成fulfilled,或者在发生错误时将它的状态改为rejected。
    如果在executor函数中抛出一个错误,那么该promise 状态为rejected。executor函数的返回值被忽略。

    对更多对Promise的描述感兴趣的可以 点击查看MDN Promise下面我们开始上代码

    let promise = new Promise((resolve, reject) = > {
        setTimeout(() = > {
            let random = Math.random()
            if (random > 0.5) {
                resolve(`resolve$ {random}`)
            } else {
                resolve(`reject$ {random}`)
            }
        }, 1000)
    })

    由上所示,Promise的构造函数接收一个函数作为参数,该函数接受两个额外的函数,resolve和reject,这两个函数分别代表将当前Promise置为fulfilled(已成功)和rejected(已失败)两个状态。Promise正是通过这两个状态来控制异步操作的结果。接下来我们将讨论Promise的用法,实际上Promise上的实例promise是一个对象,不是一个函数。在声明的时候,Promise传递的参数函数会立即执行,因此Promise使用的正确姿势是在其外层再包裹一层函数。

    let run = function() {
      return new Promise((resolve, reject) => {
        setTimeout(() => {
            let random = Math.random()
            if (random > 0.5) {
                resolve(`resolve:${random}`)
            } else {
                reject(`reject:${random}`)
            }
        }, 1000)
    })
    }
    
    run()
    run().then(
    function(value) {
        console.log(value)
    })

    每个Promise的实例对象,都有一个then的方法,这个方法就是用来处理之前各种异步逻辑的结果。

    then方法可以接受两个回调函数作为参数。第一个回调函数是Promise对象的状态变为resolved时调用,第二个回调函数是Promise对象的状态变为rejected时调用。其中,第二个函数是可选的,不一定要提供。这两个函数都接受Promise对象传出的值作为参数。
    下面是一个用Promise对象实现的 Ajax 操作的例子:

    var promise = new Promise(function(resolve,reject){
                $.ajax({
                    url:'/api/poisearch.json',
                    method:'get',
                    datatype:'json',
                    success:(res) =>{
                        resolve(res)
                    },
                    error:(err)=>{
                        reject(err)
                    }
                });
            });
    
            promise.then(function(res){
                return res.data
            }).then(function(data){
                return data.result;
            }).then(function(result){
                console.log(result)
            });
    
            //推荐使用箭头函数简写成,极大提升了代码的简洁性和可读性
            promise.then(res => res.data).then(data => data.result).then(result => console.log(result));

    参考

    https://blog.csdn.net/qq_42911663/article/details/85790181

    https://www.cnblogs.com/mark5/p/11925879.html

  • 相关阅读:
    当···时发生了什么?
    数据存储-3、数据库分库分表思路
    数据存储-2、反模式设计
    数据存储-1、MySQL 索引使用的注意事项
    锁机制-4、synchronized 与 lock 的区别
    锁机制-3、synchronize 实现原理
    锁机制-1、乐观锁与悲观锁以及乐观锁的一种实现方式
    线程-11、线程的生命周期
    线程-10、线程池的几种方式
    线程-9、线程池的实现原理
  • 原文地址:https://www.cnblogs.com/perfei/p/13435964.html
Copyright © 2011-2022 走看看