同時実行性とは、複数のタスクを同時に実行するプログラムの能力です。JavaScript では、Web ワーカー、async/await、Promise などのさまざまなメカニズムを通じて同時実行性を実現できます。この記事では、これらのメカニズムを調査し、その利点と制限について説明します。

1. Web ワーカー Web ワーカーは、JavaScript コードを別のスレッドで実行できるようにするメカニズムです。Web ワーカーは、メインスレッドをブロックせずに CPU を集中的に使用するタスクを実行したい場合に便利です。たとえば、Web ワーカーを使用すると、UI をフリーズさせることなく複雑な計算を実行できます。

以下に例を示します。

// main.js
const worker = new Worker('worker.js');
worker.postMessage('Hello from main.js');
worker.onmessage = (event) => {
  console.log('Received message from worker:', event.data);
};

// worker.js
self.onmessage = (event) => {
  console.log('Received message from main.js:', event.data);
  self.postMessage('Hello from worker.js');
};

以下に例を示します。

async function getData() {
  const response = await fetch('https://example.com/data.json');
  const data = await response.json();
  return data;
}

以下に例を示します。

fetch('https://example.com/data.json')
  .then((response) => response.json())
  .then((data) => console.log(data))
  .catch((error) => console.error(error));