js 多线程的实现

js 多线程的实现

JS是一种单线程语言，即使是一些异步的事件也是在JS的主线程上运行的。像setTimeout、ajax的异步请求，或者是dom元素的一些事件，都是在JS主线程执行的，这些操作并没有在浏览器中开辟新的线程去执行，而是当这些异步操作被操作时或者是被触发时才进入事件队列，然后在JS主线程中开始运行

单线程的语言，有一个很致命的确定。如果说一个脚本语言在执行时，其中某一块的功能在执行时耗费了大量的时间，那么就会造成阻塞。这样用户体验非常差。JS为我们提供了一个Worker的类，它的作用就是为了解决这种阻塞的现象。当我们使用这个类的时候，它就会向浏览器申请一个新的线程。这个线程就用来单独执行一个js文件

worker.js

onmessage = function (event){//监听消息
    console.log("worker.event.data:",event.data);
    var postStr ="par_ser="+event.data.id;
    var url ="";
    if(event.data.type == "all"){
        url = "/api/getwxinfo/getCustomer";
    }else if(event.data.type == "char"){
        url = "/api/getwxinfo/getchating";
        postStr = postStr+"&num="+event.data.num;
    }
    var xmlhttp=new XMLHttpRequest();
    var content = "";
         xmlhttp.open('POST',url,true);
         xmlhttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
         xmlhttp.send(postStr);
         xmlhttp.onreadystatechange = function(){
            if(xmlhttp.readyState==4 && xmlhttp.status==200){
                content = xmlhttp.responseText;
                self.postMessage({
                type:event.data.type,
                content : content
                });
            }
         }
}

index.js

var worker = new Worker(js文件路径);
    //最好先判断浏览器是否支持worker
    //最好不要反复创建worker 因为worker是开辟了一个新空间
    worker.postMessage({
        type:"all",
        id:id
    });
    //发送消息到worker.js中
    worker.addEventListener("message",function(e){
        console.log("接收消息",e.data.content);
	})

ie，火狐等浏览器不支持worker API， Gears解决worker兼容性问题。它是谷歌的插件，使用起来和workerAPI差不多

Gears.js实例：

 var worker = google.gears.factory.create('beta.workerpool');//创建worker Pool，之后创建worker
    worker.onmessage = function(e){
        console.log(e.body);
    }
    //创建worker
    var workerid = worker.createWorkerFromUrl("js/GearsWorker.js");
    //发送信息到worker中
    worker.sendMessage(getValueToDecrypt(),workerid);
    
    GearsWorker.js
    var workerpool = google.gears.workerPool;
    workerpool.onmessage = function(e){
     //把值回传主进程    
     workerpool.sendMessage(decryptedValue,e,sender);
    }