返回

同步、异步、并行的 javascript

前端

在 JavaScript 中,我们经常会遇到需要处理异步任务的情况。异步任务是指不会立即完成的任务,比如发起一个 HTTP 请求、读取一个文件或者 setTimeout 等。JavaScript 中处理异步任务主要有三种方式:同步、异步和并行。

同步

同步任务是指任务会一个接一个地执行,前一个任务执行完后才会执行下一个任务。在 JavaScript 中,同步任务是默认的执行方式。例如,以下代码是一个同步任务:

console.log('任务 1');
console.log('任务 2');
console.log('任务 3');

这段代码会依次输出任务 1、任务 2 和任务 3。

异步

异步任务是指任务不会立即完成,而是会在一段时间后完成。JavaScript 中的异步任务通常是通过回调函数或者 Promise 来实现的。回调函数是指当异步任务完成后会被调用的函数。Promise 是一个对象,它代表了一个异步操作的结果。

以下代码是一个异步任务的例子:

setTimeout(() => {
  console.log('任务 1');
}, 1000);

console.log('任务 2');
console.log('任务 3');

这段代码中,setTimeout() 函数是一个异步任务,它会在 1 秒后执行回调函数。这段代码会先输出任务 2 和任务 3,然后在 1 秒后输出任务 1。

并行

并行任务是指两个或多个任务同时执行。JavaScript 中的并行任务通常是通过多线程或者 Web Worker 来实现的。

以下代码是一个并行任务的例子:

const worker = new Worker('worker.js');

worker.postMessage('任务 1');
worker.postMessage('任务 2');
worker.postMessage('任务 3');

worker.onmessage = (e) => {
  console.log(e.data);
};

这段代码中,Worker() 构造函数创建了一个 Web Worker,它是 JavaScript 中的一个多线程环境。Web Worker 会并行执行postMessage() 方法发送的任务。这段代码会并行执行任务 1、任务 2 和任务 3,并在任务完成后通过onmessage事件监听器输出结果。

Promise

Promise 是 JavaScript 中处理异步任务的常用方式。Promise 对象代表了一个异步操作的结果,它有三种状态:

  • pending:表示异步操作还没有完成。
  • fulfilled:表示异步操作已经完成,并且结果是成功的。
  • rejected:表示异步操作已经完成,并且结果是失败的。

以下代码演示了如何使用 Promise 来处理异步任务:

const promise = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve('任务 1 完成');
  }, 1000);
});

promise.then((result) => {
  console.log(result);
});

这段代码中,new Promise() 构造函数创建了一个 Promise 对象。Promise 对象的执行器函数接受两个参数:resolve 和 reject。resolve 函数用于将 Promise 的状态设置为 fulfilled,reject 函数用于将 Promise 的状态设置为 rejected。

setTimeout() 函数是一个异步任务,它会在 1 秒后执行回调函数。回调函数中调用 resolve() 函数,将 Promise 的状态设置为 fulfilled,并将任务 1 完成作为结果。

then() 方法用于在 Promise 的状态变为 fulfilled 或 rejected 时执行回调函数。这段代码中的 then() 方法会在 Promise 的状态变为 fulfilled 时执行回调函数,并输出任务 1 完成。

回调函数

回调函数是 JavaScript 中处理异步任务的另一种常用方式。回调函数是指当异步任务完成后会被调用的函数。

以下代码演示了如何使用回调函数来处理异步任务:

setTimeout(() => {
  console.log('任务 1 完成');
}, 1000);

function callback() {
  console.log('任务 2 完成');
}

setTimeout(callback, 2000);

这段代码中,setTimeout() 函数是一个异步任务,它会在 1 秒后执行回调函数。回调函数中输出任务 1 完成。

setTimeout() 函数的第二个参数是一个回调函数,它会在 2 秒后执行。回调函数中输出任务 2 完成。

总结

同步、异步和并行是 JavaScript 中处理异步任务的三种主要方式。Promise 和回调函数是 JavaScript 中处理异步任务的两种常用工具。