H5新特性-WebWorker

2021-04-01 22:24

阅读：540

标签：返回 navig 单线程 cat lis file 参数 mina 创建

WebWorker是H5中新增的API，我们使用这个API可以轻松的创建后台线程，webworker常用于执行那些耗费事件较长的逻辑计算或者大量循环，避免页面假死的发生。

　　JavaScript语言采用单线程模型，也就是所有任务只能在一个线程上完成，一次只做一件事。

　　Web Worker的作用就是为JavaScript创建多线程的环境，主线程创建Worker线程，将一些任务分配经给后者，在主线程工作的同时，Worker也在后台运行，两者互不干扰。等到Worker线程完成任务后，再把结果返回主线程。这样的好处是，一些计算密集的任务，被Worker线程负担了，主线程就会很流畅。

1 Web Worker使用时需要注意的问题：

　　(1). 同源限制

　　(2). DOM限制：Worker线程不能访问主线程所在网页的DOM对象，也不能用document、window、parent这些对象。但是worker线程可以访问navigator、location对象

　　(3). 通信联系：worker线程与主线程不在同一个环境，所以不能直接通信，只能通过消息完成

　　(4). 脚本限制：worker线程不能执行alert()、confirm()等方法

　　(5). 文件限制：worker线程不能读取本地文件，即不能打开本机的系统(file://)，必须来源于网络

2. 基本用法

（1）主线程：

// 创建Worker线程
var worker=new Worker(‘test.js‘);  // 参数是脚本文件地址

onmessage属性

　　onmessage属性表示事件处理函数，当Worker线程返回消息被调用，其语法结构是：

Worker线程.onmessage = function(e){
   ... 
};

postMessage()方法

postMessage()方法用于向Worker线程内部作用域发送消息，其语法结构是：

worker线程.postMessage(message)
// message参数可以是任意类型数据

terminate()

terminate()方法用于终止Worker的行为，语法结构是：

worker线程.terminate()

（2）worker线程

Worker线程内部有一个监听函数，监听message事件，其语法结构是：

self.addEventListener(‘message‘,function(e){
　　.... 
})；

postMessage()方法

postMessage()方法用于向主线程发送消息:

this.postMessage(message)

close()方法

close()方法用于在Worker线程内啊关闭自身，其语法结构是：

this.close() //或者 
self.close()

H5新特性-WebWorker

标签：返回 navig 单线程 cat lis file 参数 mina 创建

原文地址：https://www.cnblogs.com/codexlx/p/12562751.html

上一篇：Netty专题(四)-----Bootstrap、ByteBuf、编码解码

下一篇：WebMagic

文章来自：搜素材网的编程语言模块，转载请注明文章出处。
文章标题：H5新特性-WebWorker
文章链接：http://soscw.com/index.php/essay/71111.html

亲，登录后才可以留言！

H5新特性-WebWorker

1 Web Worker使用时需要注意的问题：

2. 基本用法

评论

热门文章

推荐文章

最新文章

置顶文章