js多线程----拾伍浅谈

为什么 JavaScript 是单线程 ？

JavaScript 语言的一大特点就是单线程，也就是说，同一个时间只能做一件事。那么，为什么JavaScript 不能有多个线程呢 ？这样能提高效率啊。
JavaScript 的单线程，与它的用途有关。作为浏览器脚本语言，JavaScript 的主要用途是与用户互动，以及操作 DOM。这决定了它只能是单线程，否则会带来很复杂的同步问题。比如，假定JavaScript 同时有两个线程，一个线程在某个 DOM 节点上添加内容，另一个线程删除了这个节点，这时浏览器应该以哪个线程为准？
所以，为了避免复杂性，从一诞生，JavaScript 就是单线程，这已经成了这门语言的核心特征，将来也不会改变。
为了利用多核 CPU 的计算能力，HTML5 提出 Web Worker 标准，允许 JavaScript 脚本创建多个线程，但是子线程完全受主线程控制，且不得操作 DOM。所以，这个新标准并没有改变 JavaScript 单线程的本质。

JavaScript是单线程，怎样执行异步的代码 ？

单线程就意味着，所有任务需要排队，前一个任务结束，才会执行后一个任务。如果前一个任务耗时很长，后一个任务就不得不一直等着。
js 引擎执行异步代码而不用等待，是因有为有 消息队列和事件循环。
消息队列：消息队列是一个先进先出的队列，它里面存放着各种消息。
事件循环：事件循环是指主线程重复从消息队列中取消息、执行的过程。
实际上，主线程只会做一件事情，就是从消息队列里面取消息、执行消息，再取消息、再执行。当消息队列为空时，就会等待直到消息队列变成非空。而且主线程只有在将当前的消息执行完成后，才会去取下一个消息。这种机制就叫做事件循环机制，取一个消息并执行的过程叫做一次循环。

那么问题来了，如何不改变javascript单线程的运行机制，却可以实现多线程的运行效果！

HTML5标准添加了Web Worker，worker允许一段js程序运行在主线程之外的线程，子线程与主线程互不干扰，当子线程的代码执行完成，将结果返回给主线程，主线程接收到相应结果后再做对应处理，当有一些计算密集型或高延迟的任务就可以交给worker子线程来负担，主线程就不会阻塞

worker是window对象的一个方法，一个worker对象可通过构造函数（window.worker()）来创建，创建对象时，需要传给构造函数一个js文件，该文件包含了放到子线程中运行的代码

worker通过postMessage()和onmessage = () => {} 来进行通信，主线程和子线程通信是双向的，都有可以发送和接收信息，postMessage传递的数据都是拷贝传递（ArrayBuffer除外）

子线程运行耗损系统资源，所以当执行完毕后，我们可以手动关闭子线程

在主线程中关闭： worker.terminate()

在子线程中关闭： self.close()  （在子线程中window需改写成                self，下文有解释）

标题 worker限制

 1）同源
    分配给worker子线程运行的脚本文件，必须与主线程的脚本文件同源，包括协议，域名和端口，不支持本地地址（file://）；
    当使用CDN来存储js文件时，主线程与子线程就会出现跨域
    
    解决方法： 【1】将子线程的脚本转换成Blod对象
                    【2】然后给Blod对象创建一个URL
                    【3】将这个URL传给worker的构造函数

示例代码：

  var workerBlob = new Blob(['(' + function +')()'], { type: "text/javascript" });
  var url = window.URL.createObjectURL(workerBlob);
  var worker = new Worker(url);

**2) 访问
worker子线程所在的全局对象，与主线程不在一个上下文环境，所以无法读取主线程所在网页的DOM，无法使用document，window，parent这些对象，global指向有变更，window需要改写成self，不能执行alert()和comfire()的方法，只能读取部分navigator对象内的数据
3）使用异步
worker子线程中支持js的异步操作，但仍然不可以跨域

worker的兼容性还不错，但不兼容IE9**