【javascript学习指南】javascript多线程的笔记

【www.bbyears.com--html5教程】

如果有，我向你推荐html5神器web workers（IE10+）！不卡不顿不假死，充分发挥多核多线程cpu性能！

假设有个变态需求：创建10000000个0-100的随机数，并且从中筛选出5的倍数。

常规我们一般这么处理：

 代码如下

var arr = [];
for(var i=0; i<10000000; i++){
    arr[i] = Math.round(Math.random()*100);
}
var newArr = [];
for(var i=0; i     if(arr[i]%5==0) newArr.push(arr[i]);
}
alert(newArr.join(","));

试就知道了，结果是浏览器卡住假死一段时间，期间什么也做不了。所以我们拿出神器，使用多线程处理这个运算。

1、实例化Worker对象建立线程池，并保存引用
 

 代码如下 var worker = new Worker("random.js");
worker.onmessage = function(event){    //回调函数。当线程中运算完毕，信息返回时执行
    alert(event.data.join(","));    //event.data即为返回的信息
}; www.111cn.net
worker.postMessage(10000000);    //向线程发送信息。worker启动

2、新建random.js文件，编写回调方法
 

 代码如下 this.onmessage = function(event){    //
    var n = event.data;    //接收的信息，本例中为需生成的随机数个数
    var arr = [];
    for(var i=0; i<10000000; i++){
        arr[i] = Math.round(Math.random()*100);
    }
    var newArr = [];
    for(var i=0; i         if(arr[i]%5==0) newArr.push(arr[i]);
    }
    postMessage(newArr);    //运算完毕，返回信息
}

再试试，执行时浏览器不卡了吧！

想要终止这个线程，可以对线程的引用调用terminate方法，即worker.terminate()。或者在线程中直接调用close()方法。

注意：

1、线程运算中不能操作dom，需要在父级回调中操作。

2、线程中无window对象，请用self或者this代替，他们都指向全局作用域。

本文来源：http://www.bbyears.com/wangyezhizuo/50509.html