javascript - 将 then 附加到调用堆栈下多级 promise 的最佳解决方案是什么？

Question

考虑这样一个场景:

function func_topmost(){
    ...
    func_layer1();
    pseudo_code for some actions here; // an action that needs to run AFTER the promise in func_layer2 fulfilled.
}

function func_layer1(){
    ...
    func_layer2();
}

function func_layer2(){
    var the_vital_promise = $.post('very_slow_backend_response', data);
    return the_vital_promise;
}

以上只是一个例子。实际上，调用栈可能更深，并且在未来的开发中总是有可能将另一层函数引入调用栈。

我的问题是，确保最顶层的操作依赖于正确附加的底层 promise 的履行，最佳实践是什么？

现在我可以考虑让调用链中的所有函数 async function 一直到底部。我不确定这是否是正确的解决方案，并且它使后期维护非常僵化。

Answer 1

因此，您有多个正常函数相互调用，突然之间，堆栈顶部的函数恰好处理一些异步任务，您正在寻找一种方法来以最少的代码更改解决问题。我知道有 3 种方法可以处理这个问题，其中 2 种已经被提到，但我认为它们有一些缺点。

<强>1。返回 promise

• 会破坏代码结构
• 需要改变所有功能

<强>2。异步/等待

async function func_topmost(){
    const data = await func_layer1();
    pseudo_code for some actions here; // an action that needs to run AFTER the promise in func_layer2 fulfilled.
}

function func_layer1(){
    const promise = func_layer2();
    return promise;
}

function func_layer2(){
    var the_vital_promise = $.post('very_slow_backend_response', data);
    return the_vital_promise;
}

• 与返回 promise 相比，代码更改更少，但编译包中的代码更多
• 需要改变所有功能

<强>3。派发事件

如果您堆叠了许多函数，这对我来说似乎是处理问题的最佳方式。如果您在 Node 上，则可以使用事件库；如果环境是浏览器，则可以使用自定义 DOM 事件。这样您只需更改第一个和最后一个函数(如果中间的函数不依赖于 promise 完成)并且代码结构保持不变。

function func_layer2(){
    var the_vital_promise = $.post('very_slow_backend_response', data)
    .then(res => {
         events.emit('customEvent');
     });
    return the_vital_promise;
}

function func_topmost(){
    ...
    events.on('customEvent', () => {
         pseudo_code for some actions here; // an action that needs to run AFTER the promise in func_layer2 fulfilled.
    });
    func_layer1();
}