promise在JavaScript中是如何工作的?

promise基本上是一个有两种方法的对象。一个方法用于定义要做什么,另一个方法是告诉何时做。必须可以按任何顺序调用这两个方法,因此对象需要跟踪调用了哪一个:

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并定义操作。

为了简单地理解Javascript中的承诺。 您可以参考以下示例。只需在一个新的php/html文件中复制粘贴即可运行。

<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript">

function test(n){
    alert('input:'+n);

    var promise = new Promise(function(fulfill, reject) {         
      /*put your condition here */
      if(n) {
        fulfill("Inside If! match found");
      }
      else {
        reject(Error("It broke"));
      }
    });
    promise.then(function(result) {
      alert(result); // "Inside If! match found"
    }, function(err) {
      alert(err); // Error: "It broke"
    });
}

</script>

</head>
<body>
<input type="button" onclick="test(1);" value="Test"/>

</body>
</html>

1. 点击 测验 按钮
2. 它将创造新的希望,
3. 如果条件为真,则满足响应,
4. 之后 承诺。那么 调用,并根据完成情况打印 后果 .
5. 如果拒收 承诺。那么 返回错误消息。

可能最简单的promise用法示例如下:

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*

正如我们所看到的,在失败的情况下,会触发error函数(这始终是 then )然后在没有给定参数的情况下激发链中的下一个函数。

对于高级知识,我邀请你 here .

请检查这个简单的承诺代码。这将帮助您更好地理解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