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

原文地址:https://www.cnblogs.com/perfei/p/13435964.html