当前位置:首页 > JavaScript

JS实现一个并发函数

2026-01-31 11:38:07JavaScript

实现并发控制的几种方法

在JavaScript中实现并发控制可以通过多种方式,以下是几种常见的方法:

Promise.all

使用Promise.all可以并行执行多个异步任务,等待所有任务完成后再继续执行后续代码。

const task1 = fetch('https://api.example.com/data1');
const task2 = fetch('https://api.example.com/data2');
const task3 = fetch('https://api.example.com/data3');

Promise.all([task1, task2, task3])
  .then(responses => {
    // 所有请求完成后的处理
    console.log('All requests completed');
  })
  .catch(error => {
    console.error('One of the requests failed', error);
  });

async/await结合Promise.all

使用async/await语法可以更清晰地处理并发任务。

async function runConcurrentTasks() {
  try {
    const [result1, result2, result3] = await Promise.all([
      fetch('https://api.example.com/data1'),
      fetch('https://api.example.com/data2'),
      fetch('https://api.example.com/data3')
    ]);
    console.log('All tasks completed');
  } catch (error) {
    console.error('Error in one of the tasks', error);
  }
}

限制并发数的实现

如果需要限制同时执行的并发数,可以使用以下方法:

async function concurrentLimit(tasks, limit) {
  const results = [];
  const executing = [];

  for (const task of tasks) {
    const p = Promise.resolve().then(() => task());
    results.push(p);

    const e = p.then(() => executing.splice(executing.indexOf(e), 1));
    executing.push(e);

    if (executing.length >= limit) {
      await Promise.race(executing);
    }
  }

  return Promise.all(results);
}

// 使用示例
const tasks = [
  () => fetch('https://api.example.com/data1'),
  () => fetch('https://api.example.com/data2'),
  () => fetch('https://api.example.com/data3'),
  // 更多任务...
];

concurrentLimit(tasks, 2)
  .then(results => console.log('All tasks completed with limited concurrency'))
  .catch(error => console.error('Error in limited concurrency', error));

Worker Threads实现并发

在Node.js环境中,可以使用Worker Threads实现真正的并行执行。

const { Worker, isMainThread, parentPort } = require('worker_threads');

if (isMainThread) {
  // 主线程代码
  const worker1 = new Worker(__filename);
  const worker2 = new Worker(__filename);

  worker1.on('message', (msg) => console.log('Worker1:', msg));
  worker2.on('message', (msg) => console.log('Worker2:', msg));
} else {
  // 工作线程代码
  parentPort.postMessage('Hello from worker');
}

使用第三方库

对于更复杂的并发控制,可以考虑使用第三方库如p-limitasync库。

JS实现一个并发函数

const pLimit = require('p-limit');
const limit = pLimit(2); // 限制并发数为2

const tasks = [
  () => fetch('https://api.example.com/data1'),
  () => fetch('https://api.example.com/data2'),
  () => fetch('https://api.example.com/data3'),
];

(async () => {
  const results = await Promise.all(tasks.map(task => limit(task)));
  console.log('All tasks completed with p-limit');
})();

这些方法可以根据具体需求选择使用,从简单的并行执行到复杂的并发控制都可以实现。

标签: 函数JS
分享给朋友:

相关文章

vue中实现节流函数

vue中实现节流函数

使用 Lodash 的 _.throttle 方法 安装 Lodash 并导入 throttle 方法: npm install lodash 在 Vue 组件中使用: import { thro…

react如何调用函数

react如何调用函数

React 函数调用的方法 在 React 中调用函数可以通过多种方式实现,具体取决于函数的作用和调用时机。以下是常见的几种方法: 直接在组件中调用函数 函数可以在组件的 render 方法或其他…

react如何定义全局函数

react如何定义全局函数

定义全局函数的几种方法 在React中定义全局函数可以通过多种方式实现,以下是常见的几种方法: 使用全局变量挂载 将函数直接挂载到window对象上,使其成为全局可访问的函数。这种方式简单直接,但…

react函数组件如何混合

react函数组件如何混合

混合 React 函数组件的方法 在 React 中,函数组件可以通过组合、高阶组件(HOC)、自定义 Hook 或 Render Props 等方式实现混合功能。以下是几种常见的方法: 使用自定义…

react如何刷新函数组件

react如何刷新函数组件

刷新函数组件的方法 在React中,函数组件的刷新通常通过状态更新或外部触发来实现。以下是几种常见的方法: 使用useState触发重新渲染 通过更新状态变量强制组件重新渲染。React会在状态变化…

react如何绑定事件处理函数

react如何绑定事件处理函数

在 React 中绑定事件处理函数的方法 React 提供了多种方式来绑定事件处理函数,以下是常见的几种方法: 使用箭头函数自动绑定 this 在类组件中,可以使用箭头函数来定义方法,这样可以避免…