Question

我有一个简单的承诺：

function p(l) {
  return new Promise(function(resolve) {
    alert(l);
    resolve();
  });
}

然后我尝试创建一个仅在它的then子句后解析的承诺：

function pp(l1, l2) {
  return new Promise(function(resolve) {
    p(l1).then(() => {
      alert(l2);
      resolve();
    });
  });
}

我现在这样做：

p('start').then(pp('A', 'B')).then(p('end'));

我希望看到：开始，A，B，结束
但相反，我看到：开始，A，结束，B

为什么？

我怎样才能实现我想要的，创造一个承诺（pp），当它的子句完成后会解决？

Answer 1

在你的第二个功能中试试

function pp(l1, l2) {
  return new Promise(function(resolve) {
    alert(l1);
    alert(l2);
    resolve();
  });
}

或者，如果您想将p功能放在pp内，那么

function pp(l1, l2) {
  return p(l1).then(() => {
    alert(l2);
  });
}



p('start').then(() => pp('A', 'B')).then(() => p('end'));

以下是演示https://plnkr.co/edit/fUisfcWrTu89xcc4j0cu?p=preview

Answer 2

pp可以更简单地编码：

function pp(l1, l2) {
  return p(l1).then(() => {
    alert(l2);
  });
}

这是承诺的全部要点，如果你每次都必须编写复杂的代码，那就不值得：）

此外，.then期望函数回调，其中in参数是前一个promise / function的返回值。

p('start').then(() => pp('A', 'B')).then(() => p('end'));

至于你行为的确切原因，除了不使用.then链接之外，我不清楚原因。

此代码工作的原因是，在回调中返回Promise时，执行Promise，并将其解析为的值作为参数传递给下一个回调。 () => pp('A', 'B')等同于() => { return pp('A', 'B');}，pp会在调用链的下一个回调之前返回并等待。

如果您希望保持相同的.then调用语法，那么更改pp以返回回调而不是Promise会起作用：

function pp(l1, l2) {
  return () => p(l1).then(() => {
    alert(l2);
  });
}

但是你不能再将其用作Promise。链接的最后一部分仍需要更改：.then(() => p('end'))。

Answer 3

来自mdn - “onFulfilled：函数在Promise完成时调用。此函数有一个参数，即履行价值。”

我的代码问题在于then(pp('A', 'B'))我传递了then一个值（pp（）的结果是一个承诺）而不是 function （一个接收调用promise的履行值的函数）

所以正确的使用方法是始终传递一个函数：

function p(l) {
  return new Promise(function(resolve) {
    alert(l);
    resolve();
  })
}


function pp(l1, l2) {
  return p(l1).then(() => p(l2));
}


p('start').then(() => pp('A', 'B')).then(() => p('end'));

包装承诺+然后在新承诺

3 个答案: