JavaScript 多线程

多线程 是任何程序同时执行多个线程的能力。正如我们所知，JavaScript是一种单线程编程语言，这意味着它有一个单线程来处理所有的顺序执行。单线程意味着一次只运行一行代码。最初，JavaScript是单线程的，因为它只是用于单个用户的Web浏览器脚本语言，但如今它发展成了一种更强大的计算环境。

有多种技术可以在JavaScript中模拟多线程：

Web Workers

Web Workers 使我们有可能编写不会阻塞DOM的多线程JavaScript代码。即使异步操作在某种程度上阻塞了DOM，但Web Workers可以帮助我们解决这个问题，逃离单线程环境，提高网页性能。基本上，Web Workers在后台线程中运行脚本，避免对用户界面的干扰。由于具有后台线程的特性，我们可以创建或运行一些耗时的操作。

示例1： 在这个示例中，我们将展示使用和不使用Web Workers在页面行为上的区别。

• main.js

JavaScript

// Creating new web worker 
const worker = new Worker('worker.js'); 
let message = 'Hello'; 
  
// Message using postMessage 
worker.postMessage(message); 
  
// Response 
worker.onmessage = function (e) { 
    console.log(e.data); 
};

• worker.js

Javascript

self.onmessage = function (e) { 
    if (e.data !== undefined) { 
        let total = e.data + 'Geeks'; 
        self.postMessage(total) 
    } 
}

输出结果:

'Hello Geeks'

解释： 在这个例子中，我们创建了两个JavaScript文件： main.js 和 worker.js 。main.js代表主文件，worker.js代表工作文件。在上面的例子中，worker正在将接收到的字符串与定义的字符串连接在一起，并将其返回给main.js文件，而不中断页面。

异步编程

异步调用在等待上一个语句执行完成之前，下一个语句就会被执行。JavaScript提供了回调函数、Promises和async/await来执行非阻塞函数。通过异步编程，我们通过启动多线程并处理其完成来实现类似并行的行为。

例子2： 在这个例子中，我们使用setTimeout()函数来实现JavaScript中的多线程编程。

Javascript

console.log("Starting..."); 
setTimeout(function () { 
    console.log("Welcome to geeksforgeeks"); 
}, 2000); 
console.log("Ending...");

输出： 上面的例子显示当我们使用异步程序时，代码不会阻塞，实际上它会执行下一行，函数会在指定的时间后执行。

Starting...  
Ending...  
Welcome to geeksforgeeks