引子：（JS單線程）

什麽是webworker？
Web Worker為Web應用程序提供了一種能在後臺中運行的方法。通過Web Worker可以生成多個線程同時運行，並保證頁面對用戶的及時響應，完全不會影響用戶的正常操作。

單線程：單線程在程序執行時，所走的程序路徑按照連續順序排下來，前面的必須處理好，後面的才會執行。簡單的說就是處理事務的任務鏈，當只有一條鏈，所有的事情都在這一條鏈上執行時，那就是單線程。

優點：單線程較多線程來說，系統穩定、擴展性極強、軟件豐富。

缺點：只有一個線程，代碼順序執行，容易出現代碼阻塞（頁面假死）。

多線程：為Js 提供了多線程處理能力，一些復雜、數據量大的處理時可以讓別的線程去處理，處理的同時不影響主線程的執行（簡稱異步），從而讓頁面運行更加流暢而且不失效果。

Web Worker說明：

Web主線程:
1.通過 worker = new Worker( url ) 加載一個JS文件來創建一個worker，同時返回一個worker實例。
　　url:  需要異步處理的js文件路徑

2.通過 worker.postMessage( data ) 方法來向worker發送數據。
　　data:  要發送的數據

3.綁定 worker.onmessage(value)方法來接收worker發送過來的數據。
　　value:  postMessage發送過來的數據

4.可以使用 worker.terminate
 
() 來終止一個worker的執行。

worker子線程：
1.通過postMessage( data ) 方法來向主線程發送數據。
2.綁定onmessage方法來接收主線程發送過來的數據。

1）創建一個Worker：

通常，與web worker相關的代碼都放在一個獨立的JavaScript文件中。父線程通過在Worker構造函數中指定一個JavaScript文件的鏈接來創建一個新的worker，它會異步加載並執行這個JavaScript文件。

// var worker = new Worker(子線程路徑);
// console.log(worker); //對象 身上有很多數據
 


let worker = new Worker(‘worker.js‘); //創建
worker.postMessage(‘我是要傳遞的數據‘);  //postMessage方法向worker發送數據。

2)編寫子線程 worker.js：

this.onmessage = function(ev){
    console.log(ev.data);  // html頁面打印出我是要傳遞的數據   註：子線程沒有alert
};

註意：

1.子線程進行計算，不能進行 DOM BOM操作
2.子線程不能跨域，文件需放在同路徑中
3.子線程不能套子線程
4.子線程 不和主線程共享數據，而是復制一份兒 哪怕是對象

子線程可以直接輸入運算：

//主線程 html頁面
let worker = new Worker(‘worker1.js‘);
worker.postMessage(5);

//子線程 worker1.js
this.onmessage = function(ev){
console.log(ev.data+5);    //  10  
};

可以利用子線程為我們做一些計算：

let worker = new Worker(‘worker2.js‘);
worker.postMessage(10);  //向子線程發送數據
worker.onmessage = function(ev){ //接收字線程發送過來的數據
console.log(ev.data);  //15
};

//子線程 worker2.js
this.onmessage = function(ev){  //接收主線程發送過來的數據
this.postMessage(ev.data+5);  //向主線程發送數據
};

以上就是介紹js開啟多線程方法了。

詳情直戳官方介紹 HTML5 Web Worker http://www.w3school.com.cn/html5/html_5_webworkers.asp

HTML5新特性 Web Workers 實現多線程