深入理解JavaScript中的并行处理的介绍.docx

深入理解JavaScript中的并行处理的介绍

有关深入理解JavaScript中的并行处理的介绍前言为什么说多线程如此重要？这是个值得思考的问题。一直以来，派生线程以一种优雅的方式实现了对同一个进程中任务的划分。操作系统负责分配每个线程的时间片，具有高优先级并且任务繁重的线程将分配到更多的时间片，而低优先级空闲的线程只能分到较少的时间片。虽然多线程如此重要，但JavaScript却并没有多线程的能力。幸运的是，随着WebWorker的普及，我们终于可以在后台线程来处理资源密集型的计算了。而不好的方面是，目前制定的标准只适用于当前的生态系统，这有时候就比较尴尬了。如果你了解其他从一开始就支持多线程的语言的话，你可能会发现很多的限制，远非仅仅是实例化一个新线程，然后你操控这个实例就能实现多线程。这篇文章主要来介绍WebWorker，包括什么时候使用，该怎么使用，它有什么奇怪的特性，会介绍在Webpack中如何使用它，还有可能遇到的一些坑。一、WebWorkersWebWorker可能是在JavaScript中唯一可以真正实现多线程的方法了。我们需要按照下面的方式创建worker：constworker=newWorker("worker.js");上面就定义了一个Worker实例，然后你可以通过postMessage与worker通信，就像和iFrame通信一样，只不过不存在跨域的问题，不需要验证跨域。worker.postMessage(num);在worker代码中，你需要监听这些事件：onmessage=(e)=>{//e.datawillcontainthevaluepassed};这种方式是双向的，所以你也可以从worker中postMessage给我们的主程序。在worker代码中：postMessage(result);在主程序中：worker.onmessage=(e)=>{}这就是worker最基本的用法。异常处理在你的worker代码中，有很多种方式来处理异常，比如你可以catch之后通过postMessage传递，这样可能需要多些一些代码，但是确实最有效也最安全的。另一种方式是用onerror事件，这种方式可以捕捉所有未处理的异常，并且交给调用方来决定如何处理。调用方式很简单：worker.onerror=(e)=>{};为了调试方便，异常对象中还有一些额外的字段比如：filename，lineno，colno.回收将不需要的worker回收是非常重要的，worker会生成真正的操作系统线程，如果你发现与很多worker线程同时运行，你可以通过很简单的杀掉浏览器进程。你有两种方式杀掉worker进程：在worker里和在worker外。我认为最好的处理worker生命周期的地方是在主页面里，但这也要取决于你代码的具体情况。杀掉一个worker实例，在外部可以直接调用terminate()方法，这种方法可以立即杀掉它，释放所有它正在使用的资源，如果它正在运行，也会立即终止。如果你想要让worker自己去管理它的生命周期，可以直接在worker代码中调用stop()方法。不管使用哪种方法，worker都会停止，销毁所有资源。如果你想使用一种“一次性”的worker，比如需要做一些复杂运算之后就不再使用了，也要确保在onerror事件中去销毁它们，这样有利于规避一些难以发现的问题。worker.onerror=(e)=>{worker.terminate();reject(e);};worker.onmessage=(e)=>{worker.terminate();resolve(e.data);}二、行内Workers有些时候将worker代码写到一个外部文件可能会使原本简单的问题变得复杂，幸运的是，workers也可以用一个Blob来初始化。写一个行内worker，参考如下代码段：//Putyourworkercodehereconstcode=URL.createObjectURL(newBlob([document.getElementById("worker").textContent]));constworker=newWorker(code);这样你就创建了一个全局的ObjectURL，但别忘了当不需要的时候要销毁它：worker.terminate();URL.revokeObjectURL(code);三、Workers嵌套理论上，你可以嵌套使用worker，就像在主线程中定义一个worker一样。这里有一个简单的例子。但是不幸的是在Chrome中一直存在一个bug，让我们不能愉快的玩耍，或许以后这个bug会修复，但是目前来