Html5之高级-12 Web Workers(概述、 API)

一、Web Workers 概述

Web Workers 简介

- Web Workers 是运行在后台的 JavaScript

- 充分利用多核 CPU 的优势

- 对多线程支持非常好

- 不会影响页面的性能

- 不能访问Web页面 和 DOM API

二、Web Workers API

Web Workers API

- 检测浏览器对 Web Worker 的支持性

- 创建 Web Worker 文件

- 创建 Web Worker 对象

- 与 Web Worker 进行通信

- onMessage 事件:该事件用于监听 Web Worker 传递的消息

- postMessage() 方法: 该方法用于 Web Workder 传递消息

- 终止 Web Worker

检测 Web Workers

- 在创建 Web Worker 之前，需要先检测用户浏览器是否支持

创建 Web Worker 文件

- 创建普通的 JS 文件，都可以用于 Web Worker 文件

- Web Worker 文件可以调用通信的事件和方法

- onMessage 事件

- postMessage()

创建 Web Worker 对象

- 在 HTML 页面中，通过 Worker 的构造器创建 Web Worker 对象

var w = new Worker("myworker.js");

- Worker 的构造器接受的参数: 表示指定调用的 Web Worker 文件的路径

与 Web Worker 通信

- onMessage 事件

- 用于监听 Web Worker 传递消息，通过回调函数接收传递的消息

- 通过回调函数的参数 data 属性可以获取传递的消息

- postMessage()方法

- 通过postMessage()方法传递消息内容

终止 Web Worker

- 在 HTML 页面中，通过调用 Web Worker 对象的 terminate()方法终止 Web Worker

总结：本章内容主要介绍了下 HTML5 Web Workers(概述、 API)