链式调用异步函数

JavaScriptJavaScriptBeginner
立即练习

This tutorial is from open-source community. Access the source code

💡 本教程由 AI 辅助翻译自英文原版。如需查看原文,您可以 切换至英文原版

简介

在本实验中,我们将探索如何在JavaScript中链式调用异步函数。我们将学习如何遍历包含异步事件的函数数组,并在每个事件完成时调用 next 函数。在实验结束时,你将能够以特定顺序高效地执行一系列异步操作。


Skills Graph

%%%%{init: {'theme':'neutral'}}%%%% flowchart RL javascript(("`JavaScript`")) -.-> javascript/BasicConceptsGroup(["`Basic Concepts`"]) javascript(("`JavaScript`")) -.-> javascript/AdvancedConceptsGroup(["`Advanced Concepts`"]) javascript(("`JavaScript`")) -.-> javascript/ToolsandEnvironmentGroup(["`Tools and Environment`"]) javascript/BasicConceptsGroup -.-> javascript/variables("`Variables`") javascript/BasicConceptsGroup -.-> javascript/data_types("`Data Types`") javascript/BasicConceptsGroup -.-> javascript/arith_ops("`Arithmetic Operators`") javascript/BasicConceptsGroup -.-> javascript/comp_ops("`Comparison Operators`") javascript/AdvancedConceptsGroup -.-> javascript/async_prog("`Asynchronous Programming`") javascript/ToolsandEnvironmentGroup -.-> javascript/debugging("`Debugging`") subgraph Lab Skills javascript/variables -.-> lab-28192{{"`链式调用异步函数`"}} javascript/data_types -.-> lab-28192{{"`链式调用异步函数`"}} javascript/arith_ops -.-> lab-28192{{"`链式调用异步函数`"}} javascript/comp_ops -.-> lab-28192{{"`链式调用异步函数`"}} javascript/async_prog -.-> lab-28192{{"`链式调用异步函数`"}} javascript/debugging -.-> lab-28192{{"`链式调用异步函数`"}} end

链式调用异步函数

要链式调用异步函数,请打开终端/SSH并输入 node。然后,遍历包含异步事件的函数数组,并在每个异步事件完成时调用 next 函数。

以下是一个演示如何链式调用异步函数的代码片段:

const chainAsync = (fns) => {
  let curr = 0;
  const last = fns[fns.length - 1];
  const next = () => {
    const fn = fns[curr++];
    fn === last ? fn() : fn(next);
  };
  next();
};

chainAsync([
  (next) => {
    console.log("0 秒");
    setTimeout(next, 1000);
  },
  (next) => {
    console.log("1 秒");
    setTimeout(next, 1000);
  },
  () => {
    console.log("2 秒");
  }
]);

总结

恭喜你!你已经完成了“链式调用异步函数”实验。你可以在LabEx中练习更多实验来提升你的技能。

您可能感兴趣的其他 JavaScript 教程