介绍

Web Workers 是 HTML5 提供的一个javascript多线程解决方案，我们可以将一些大计算量的代码交由webWorker运行而不冻结用户界面。webWorker的基本原理就是在当前javascript的主线程中，使用Worker类加载一个javascript文件来开辟一个新的线程，起到互不阻塞执行的效果，并且提供主线程和新线程之间数据交换的接口：postMessage，onmessage。

列子

<script    type="text/javascript">
        var    worker    =new    Worker("worker.js");    //创建一个Worker对象并向它传递将在新线程中执行的脚本的URL
        worker.postMessage("hello    world");                    //向worker发送数据
        worker.onmessage    =function(evt){                    //接收worker传过来的数据函数
            console.log(evt.data);                                                        //输出worker发送来的数据
        }
</script>

通过这个例子我们可以看出使用web worker主要分为以下几部分:

• WEB主线程:

1.通过 worker = new Worker( url ) 加载一个JS文件来创建一个worker，同时返回一个worker实例。

2.通过worker.postMessage( data ) 方法来向worker发送数据。

3.绑定worker.onmessage方法来接收worker发送过来的数据。

4.可以使用 worker.terminate() 来终止一个worker的执行。

• worker新线程：

1.通过postMessage( data ) 方法来向主线程发送数据。

2.绑定onmessage方法来接收主线程发送过来的数据。

为什么用webworker

由于javascript是单线程执行的，在求数列的过程中浏览器不能执行其它javascript脚本，UI渲染线程也会被挂起，从而导致浏览器进入僵死状态。使用web worker将数列的计算过程放入一个新线程里去执行将避免这种情况的出现。
如果想更详细的了解点我跳转