Blog icon indicating copy to clipboard operation
Blog copied to clipboard

简述下对 webWorker 的理解?

Open YvetteLau opened this issue 6 years ago • 1 comments

YvetteLau avatar Apr 21 '19 15:04 YvetteLau

HTML5则提出了 Web Worker 标准,表示js允许多线程,但是子线程完全受主线程控制并且不能操作dom,只有主线程可以操作dom,所以js本质上依然是单线程语言。

web worker就是在js单线程执行的基础上开启一个子线程,进行程序处理,而不影响主线程的执行,当子线程执行完之后再回到主线程上,在这个过程中不影响主线程的执行。子线程与主线程之间提供了数据交互的接口postMessage和onmessage,来进行数据发送和接收。

var worker = new Worker('./worker.js'); //创建一个子线程
worker.postMessage('Hello');
worker.onmessage = function (e) {
    console.log(e.data); //Hi
    worker.terminate(); //结束线程
};
//worker.js
onmessage = function (e) {
    console.log(e.data); //Hello
    postMessage("Hi"); //向主进程发送消息
};

仅是最简示例代码,项目中通常是将一些耗时较长的代码,放在子线程中运行。

YvetteLau avatar Apr 22 '19 03:04 YvetteLau