分线程操作

---

Web Workers 是 HTML5 提供的一个javascript多线程解决方案，我们可以将一些大计算量的代码交由web Worker运行而不冻结用户界面。

进程和线程

• 进程:
  • 打开一个app相当于打开了一个进程,进程是由线程说组成的(最少也得有一个主线程)
• 线程:
  • 主线程和分线程(多线程开发)
• 耗时太多的操作(发送网络请求,读取文件)一定得放在异步执行,否则就会造成线程的卡死–卡屏

如何使用Worker

newThread.js界面

onmessage = function(event){
	console.log(event.data);
	postMessage('传回主线程的值');	
}

html页面

var thread = new Worker('newThread.js');
thread.postMessage('这里是要传的值')
thread.onmessage = function(event){
	console.log(event.data);//newThread传来的数据
}

开启分线程的步骤

一、 开启分线程

var thread = new Worker('newThread.js');  //这里的js文件时新创建的

二、 线程之前的传值(线程与线程之间的作用域是独立的 不能相互访问)

thread.postMessage(这里是要传的值)

三、 接受线程的传值(其他线程通过postMessage()传递值时触发onmessage)

onmessage = function(event){
	//event.data	//值在data中
	postMessage(传回主线程的值)	//第四步的操作
}

四、 分线程传值回主线程

由于线程之间的作用域是独立的,所以分线程不能访问主线程的变量
postMessage('传回主线程的值');

五、 主线程接收分线程传回的值

(当分线程postMessage 时 ,会触发分线程中的onmessage)

thread.onmessage = function(event){
	event.data	//值在data中
}

六、 中断分线程(分线程关闭后,未执行完的代码会立刻停止,而且不会给主线程发消息)

thread.terminate();        

Web Worker的优缺点

我们可以做什么：

1.可以加载一个JS进行大量的复杂计算而不挂起主进程，并通过postMessage，onmessage进行通信

2.可以在worker中通过importScripts(url)加载另外的脚本文件

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

4.可以使用XMLHttpRequest来发送请求

5.可以访问navigator的部分属性

有哪些局限性：

1.不能跨域加载JS

2.worker内代码不能访问DOM

3.各个浏览器对Worker的实现不大一致，例如FF里允许worker中创建新的worker,而Chrome中就不行

4.不是每个浏览器都支持这个新特性

以上就是我对分线程的一些理解,不足之处希望大牛们多提一些意见,感激不尽