一、history

window.history; 对象上的方法和属性

A：属性

1、window.history.length: 表示浏览器的访问页面的条数
2、history.state; 返回replcaeState()方法和pushState()等方法设置的第一个参数

// history.replaceState('this is a test', null, 'test.html')
console.log(history.state)   // this is a test

B: 方法

1、window.history.back(); 后退；返回undefined
2、window.history.forword() ; 前进； 返回undefined
3、history.go(num); 前进或后退的数量num (0 表示刷新)
4、history.replaceState(arg1, arg2, arg3)
arg1: 表示状态对象； arg2表示更改后页面名；arg3：路由最后一个参数
设置过后长度不会+1

// https: //www.zhidao.con/abc/cde?name=123&age=24
history.replaceState('this is a test', null, 'test')  // 不会刷新页面
// https: //www.zhidao.con/test

5、pushState（arg1, arg2, arg3）
设置过后 history.length 的长度+1；

C：事件：

history模式路由发生变化

1、popState

window.addEventListener('popstate', e => {
  // 当每次回退或这前进时浏览器触发这个事件
  // pushState(), replaceState()  不触发这个事件
  console.log(e.state)   // 表示之前pushState时设置的状态；
}, false)

hash模式路由发生变化监听事件

2、hashchange事件

fetch() parent();

二：worker

worker实例中没有document，window，parent，但是可以发ajax请求
一个worker可以委派多个worker

创建一个线程，去处理数据；

方法：

let worker = new Worker (path);
myworker.terminate() ; 终止worker

if(window.Worker) {
      let worker = new Worker('./worker.js');
      let waitRes = {num1: 1, num2: 2};
      // 等待接收数据的结果 异步
      worker.onmessage = function (e) {
        console.log(e.data);  // 4
        // 如果后续程序依赖这个返回的结果，则会出现问题
      }
      // 发送数据 异步
      worker.postMessage(waitRes)
      console.log(1);
    }

// 接收数据 异步
this.onmessage = function (e) {
  let {num1, num2} = e.data;
  let result = {res: num1 + num2};
  // 发送数据
  this.postMessage(result)
  console.log(3);
}
console.log(2);

解决的场景：

假设程序需要计算、收集1~9999的之间所有质数，不采用后台线程，而是之间是使用JavaScript前台线程的计算、收集质数
可以创建worker线程；通过异步计算，等worker.js线程 计算完毕后返回结果，不影响主线程

例题：

点击Start Worker按钮启动web worker，可以看到web worker开始工作，且在web worker正常工作时，我们仍然可以在input输入框中输入信息，这表示页面并没有因为web worker的运行而被阻塞：