Bootstrap

前端进阶(十八)js多线程

HTML5引入Web Works,让js支持多线程。

一、多线程demo

1、先写一个add函数

function(a, b){
    if(a && b){
        return a + b;
    }
    return 0;
}

把这个函数写到works,js中

2、使用web works的钩子函数onmessage和postMessage,在钩子onmessage中监听接收主线程的数据,在钩子postMessage中发送数据。

console.log('work.js is start!');
onmessage = function(event){
    var num = event.data;
    postMessage(num.a, num.b);
}

3、主线程先启动一个works子线程,把数据发给它,同时监听onmessage,取到子线程传递给他的结果。

console.log('main.js is start!');
var worker = new Worker("work.js");
worker.onmessage = function(event){
    console.log(`receive result: ${event.data}`);
}

var a = 1, b = 2;
worker.postMessage({
    a,
    b
});

注意:(1)

;