web worker是html5 提供的一個JavaScript多線程的解決方案，worker用于處理一些大量復(fù)雜耗時的計算，免得頁面凍結(jié)、掛起、卡死。

比如：我們要運算一個復(fù)雜的數(shù)學(xué)計算：遞歸計算。

var fibonacci =function(n) {
return n <2? n : arguments.callee(n -1) + arguments.callee(n -2);
};
fibonacci(40)

當(dāng)參數(shù)達(dá)到40或者以上的時候，頁面就會出現(xiàn)明顯的卡死現(xiàn)象。這個時候用戶就只能等待算計結(jié)束才可以做其他操作。這種情況下就適合使用worker開辟新線程來處理這個運算。

main.html頁面為主線程

<script>

//開辟一個新線程

var worker = new Worker('worker.js');

worker.postMessage(40) ;

worker.onmessage = function(ev){

console.log(ev);

worker.terminate() //終止一個worker線程

};

</script>

worker.js 開辟的新線程

//新線程

//定義遞歸函數(shù)

var fibonacci =function(n) {

return n <2? n : arguments.callee(n -1) + arguments.callee(n -2);

};

onmessage = function(ev){

var param = parseInt(ev.data,10) ;

//把地柜函數(shù)的計算交給新線程，計算完之后用postMessage把結(jié)果傳回給主線程

postMessage(fibonacci(param))

}

這樣就可以實現(xiàn)主線程和新開辟的線程之間的信息交互。復(fù)雜的計算就交給了worker.js。頁面不用卡死。新線程會在處理完計算之后把數(shù)據(jù)傳回給主線程（有點異步請求的感覺）。

總結(jié)我們可以做什么：

1.可以加載一個JS進(jìn)行大量的復(fù)雜計算而不掛起主進(jìn)程，并通過postMessage，onmessage進(jìn)行通信

2.可以在worker中通過importScripts(url)加載另外的腳本文件

3.可以使用 setTimeout(), clearTimeout(), setInterval(), and clearInterval()

4.可以使用XMLHttpRequest來發(fā)送請求

5.可以訪問navigator的部分屬性

有那些局限性：

1.不能跨域加載JS

2.worker內(nèi)代碼不能訪問DOM

3.各個瀏覽器對Worker的實現(xiàn)不大一致，例如FF里允許worker中創(chuàng)建新的worker,而Chrome中就不行

4.不是每個瀏覽器都支持這個新特性.

總結(jié)

以上是生活随笔為你收集整理的HTML5 API详解（8）:worker多线程教你如何避免页面卡死的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。