Promises如何在JavaScript中运行?

时间:2013-08-24 18:56:51

标签: javascript asynchronous

我刚刚实现了我的第一个函数,该函数根据AngularJS中的另一个承诺返回一个promise,并且它有效。但在我决定只是之前,我花了2个小时阅读并试图理解承诺背后的概念。我想如果我能编写一段模拟承诺如何工作的简单代码,那么我就能够在概念上理解它,而不是在不知道它是如何工作的情况下使用它。我无法编写该代码。

那么,有人可以用vanilla JavaScript来说明承诺是如何运作的吗?

4 个答案:

答案 0 :(得分:30)

承诺基本上是一个有两种方法的对象。一种方法是定义要做什么,一种是告诉何时做。必须能够以任何顺序调用这两个方法,因此对象需要跟踪已调用的方法:

var promise = {
  isDone: false,
  doneHandler: null,
  done: function(f) {
    if (this.isDone) {
        f();
    } else {
        this.doneHandler = f;
    }
  },
  callDone: function() {
    if (this.doneHandler != null) {
        this.doneHandler();
    } else {
        this.isDone = true;
    }
  }
};

您可以先定义操作,然后触发它:

promise.done(function(){ alert('done'); });
promise.callDone();

您可以先触发操作,然后定义它:

promise.callDone();
promise.done(function(){ alert('done'); });

演示:http://jsfiddle.net/EvN9P/

在异步函数中使用promise时,该函数会创建空的promise,保留对它的引用,并返回引用。处理异步响应的代码将触发promise中的操作,调用异步函数的代码将定义操作。

由于其中任何一个都可以按任何顺序发生,调用异步函数的代码可以挂起promise并在任何时候定义动作。

答案 1 :(得分:0)

承诺使用的最简单的例子可能就是:

var method1 = (addings = '') => {
  return new Promise(resolve => {
    console.log('method1' + addings)
    resolve(addings + '_adding1');
  });
}
var method2 = (addings = '') => {
  return new Promise(resolve => {
    console.log('method2' + addings)
    resolve(addings + '_adding2');
  });
}

method1().then(method2).then(method1).then(method2);
// result:
// method1            
// method2_adding1    
// method1_adding1_adding2
// method2_adding1_adding2_adding1

这是基础知识的基础。有了它,你可以尝试拒绝:

var method1 = (addings = '*') => {
  return new Promise((resolve, reject) => {
    console.log('method1' + addings)
    resolve(addings + '_adding1');
  });
}
var method2 = (addings = '*') => {
  return new Promise((resolve, reject) => {
    console.log('method2' + addings)
    reject();
  });
}
var errorMethod = () => {
  console.log('errorMethod')
}
method1()
.then(method2, errorMethod)
.then(method1, errorMethod)
.then(method2, errorMethod)
.then(method1, errorMethod)
.then(method2, errorMethod);
// result:
// method1*           
// method2*_adding1
// errorMethod
// method2*
// errorMethod
// method2*

正如我们所看到的,如果失败,则会触发错误函数(它始终是then的第二个参数),然后在没有给定参数的情况下触发链中的下一个函数。

对于高级知识,我邀请您here

答案 2 :(得分:0)

  

请检查此简单的承诺代码。这将帮助您更好地了解Promise功能。

     

promise是一个对象,它可能在将来的某个时候产生单个值:已解决的值或未解决的原因。一个承诺可能处于以下三种可能状态之一:已实现,已拒绝或未决。承诺用户可以附加回调以处理已实现的值或拒绝的原因。

let myPromise = new Promise((resolve, reject)=>{
  if(2==2){
    resolve("resolved")
  }else{
    reject("rejected")
  }
});

myPromise.then((message)=>{
  document.write(`the promise is ${message}`)
}).catch((message)=>{
  document.write(`the promise is ${message}`)
})

check this out

答案 3 :(得分:-1)

为了简单了解Javascript中的承诺。 你可以参考下面的例子。只需将粘贴复制到新的php / html文件中即可运行。

use open ':encoding(utf8)';
binmode STDOUT, ':utf8';

...


#assume $amatch contains non-ascii characters 
$amatch = ord($amatch);
$amatch = sprintf("&#x%x;", $amatch);
  1. 点击测试按钮,
  2. 它将创造新的承诺,
  3. 如果条件为真,则表示响应,
  4. promise.then 之后调用并根据履行情况打印结果
  5. 如果拒绝 promise.then 会返回错误消息。