* Web Workers

* 基本内容

* 什么是Worker?

* 是一个运行在后台的JavaScript

* 独立于HTML页面运行的一段JavaScript代码

* Worker的特点

* 同时运行几个逻辑,并不需要顺序执行

* 独立于HTML页面的循序执行

* Worker之间相对是独立的

* Worker的问题

* 不能操作页面 - 单纯的JS逻辑

* 导致也不能使用BOM

* 不能使用DOM

* Worker API

* 检测浏览器对Worker支持情况

* 创建Worker文件

* 创建Worker对象

* 与Worker进行通信

* onmessage事件

* postMessage()方法

* 终止Worker

* Web存储API

* 基本内容

* 数据库产品 - 持久性存储数据

* 浏览器内存 - JavaScript的变量与函数

* Cookie - 存储在用户的硬盘(跨浏览器)

* HTML5的存储

* localStorage(本地存储) - 替代Cookie

* 存储在localStorage的数据,由用户决定是否删除

* sessionStorage(会话存储) - 替代Session

* 当页面关闭时,sessionStorage中存储的数据会被清空

* HTML5的数据库

* Web SQL

* IndexedDB - 轻量级数据库产品

* Cookie的问题

* Cookie的文件最大限制4KB

* 每个Web应用最多只能使用200多个Cookie文件

* Cookie是以明文存储数据(未加密)

* 一次会话

* 客户端与服务器端建立连接,直到关闭连接的过程

* session Storage

* 属性

* length - 返回当前Storage存储的数据个数

* 方法

* setItem(key,value) - 保存数据到Storage

* key - 保存数据的标识(唯一,不可重复)

* value - 保存的数据

* getItem(key) - 获取Storage存储的数据

* key - 保存数据的标识

* removeItem(key) - 根据key删除Storage指定数据

* key - 保存数据的标识

* key(index) - 根据索引值返回key值

* index - 索引值

* clear() - 清空

* local Storage

* 属性

* length - 返回当前Storage存储的数据个数

* 方法

* setItem(key,value) - 保存数据到Storage

* key - 保存数据的标识(唯一,不可重复)

* value - 保存的数据

* getItem(key) - 获取Storage存储的数据

* key - 保存数据的标识

* removeItem(key) - 根据key删除Storage指定数据

* key - 保存数据的标识

* key(index) - 根据索引值返回key值

* index - 索引值

* clear() - 清空

* storage事件

* 作用 - 实现多页面之间共享数据

* 注意 - 该事件目前只有Safari浏览器支持

* Web Socket

* 基本内容

* Socket - 就是一种网络协议,类似于HTTP

* Socket与Http的区别

* Http协议

* 短连接

* 无状态

* Socket协议

* 实时连接

* 有状态

* HTML5提供的Web Socket底层封装Socket协议

* WebSocket API

* 创建WebSocket对象

var socket = new WebSocket(url);

* url - 服务器端的地址

* 协议 - "ws://"或"wss://"

* 作用 - 与服务器端建立连接

* 方法

* send(data)方法 - 向服务器端发送请求数据

* data - 请求数据

* close()方法 - 关闭与服务器端的连接

* 事件

* onmessage事件 - 用于监听服务器端的状态

* onopen事件 - 用于监听打开连接

* 触发 - 打开连接时被触发

* 作用 - 该事件的处理函数完成必要的初始化

* onclose事件 - 用于监听关闭连接

* 触发 - 关闭连接时被触发

* 作用 - 该事件的处理函数完成资源释放