当前位置：首页 > JavaScript

js实现流程

2026-04-05 09:55:27JavaScript

实现流程的 JavaScript 方法

使用 Promise 链式调用
通过 Promise 的 then 和 catch 方法实现顺序执行和错误处理。

function step1() {
  return new Promise((resolve) => {
    console.log("Step 1 completed");
    resolve();
  });
}

function step2() {
  return new Promise((resolve) => {
    console.log("Step 2 completed");
    resolve();
  });
}

step1()
  .then(step2)
  .catch((error) => console.error("Error:", error));

使用 async/await
通过 async 函数和 await 关键字实现更简洁的流程控制。

js实现流程

async function runProcess() {
  try {
    await step1();
    await step2();
    console.log("All steps completed");
  } catch (error) {
    console.error("Error:", error);
  }
}
runProcess();

事件驱动模式
通过 EventEmitter 实现事件监听和触发，适合解耦的流程。

js实现流程

const EventEmitter = require('events');
class MyEmitter extends EventEmitter {}
const emitter = new MyEmitter();

emitter.on('step1', () => {
  console.log("Step 1 completed");
  emitter.emit('step2');
});

emitter.on('step2', () => {
  console.log("Step 2 completed");
});

emitter.emit('step1');

使用生成器函数
通过 function* 和 yield 分步执行流程。

function* processGenerator() {
  yield console.log("Step 1 completed");
  yield console.log("Step 2 completed");
}

const gen = processGenerator();
gen.next();
gen.next();

状态机模式
通过对象或类管理流程状态，适合复杂流程。

class StateMachine {
  constructor() {
    this.state = 'idle';
  }

  nextState() {
    switch (this.state) {
      case 'idle':
        this.state = 'step1';
        console.log("Step 1 completed");
        break;
      case 'step1':
        this.state = 'step2';
        console.log("Step 2 completed");
        break;
    }
  }
}

const sm = new StateMachine();
sm.nextState();
sm.nextState();