ITPub博客

首页 > 应用开发 > Javascript > 详细信息用于javascript中的承诺使用详解

详细信息用于javascript中的承诺使用详解

原创 Javascript 作者:标梵互动 时间:2020-11-10 14:45:53 0 删除 编辑

熟悉前端开发的都一定写过回调方法(callback),简单的说,回调方法是一个函数被作为参数传递给另一个函数,比如下面的代码 


function say (value) {
    alert(value);
}
function execute (someFunction, value) {
    someFunction(value);
}
execute(say, 'hello word');


say函数作为参数传递给execute函数,一般来说我们会碰到的回调嵌套都不会很多,一般就一到两级,但是某些情况下,回调嵌套很多时,代码就会非常繁琐,会给我们的编程带来很多的麻烦,这种情况俗称——地狱回调。


那么如何解决地狱回调,保持我们的代码简短,这时Promise就出场了,Promise对象可以理解为一次执行的异步操作,使用Promise对象之后可以使用一种链式调用的方式来组织代码;让代码更加的直观。我们用Promise对象改造上面的代码


function say(value) {
    return new Promise(function(resolve, reject) {
        resolve(value)
    })
}
function execute(value) {
    return new Promise(function(resolve, reject) {
        resolve(value)
    })
}
execute('hello word').then((value)=>{
    say(value).then((sayValue)=>{   
        alert(sayValue)
    })
})


上面代码只是根据第一段代码做的演示,代码量增加了,但是比传统的解决方案更合理和更强大。


Promise正如字面意思-承诺,“承诺将来会执行”约定的事情。我们首先需要了解Promise的三种状态:

pending: 初始状态,既不是成功,也不是失败状态。


fulfilled: 意味着操作成功完成。


rejected: 意味着操作失败。


先来构造下一个Promise实例


const promise = new Promise(function(resolve, reject) {
  // … some code
  If (/* 异步操作成功 */){
    resolve(value);
  } else {
    reject(error);
  }
});


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


Resolve函数的作用是,将Promise对象的状态从“未完成”变为“成功”(即从 pending 变为 resolved),在异步操作成功时调用,并将异步操作的结果,作为参数传递出去;


Reject函数的作用是,将Promise对象的状态从“未完成”变为“失败”(即从 pending 变为 rejected),在异步操作失败时调用,并将异步操作报出的错误,作为参数传递出去。


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


还是拿第二段代码演示,讲下运行过程,首先是这段代码


execute('hello word').then((value)=>{
    say(value).then((sayValue)=>{   
        alert(sayValue)
    })
})

首先是调用execute方法,传入‘hello word’,这个execute方法返回promise对象。调用用then方法接收值,再调用say方法,传入execute方法返回的值,再调用then方法接收,最后alert。

来自 “ ITPUB博客 ” ,链接:https://blog.itpub.net/69987244/viewspace-2733283/ ,如需转载,请注明出处,否则将追究法律责任。

请登录后发表评论 登录
全部评论

注册时间:2020-11-05

  • 博文量
    4
  • 访问量
    4808