QQs'Note
0%

js线程和多线程js

Posted on Edited on In

多线程 worker.js

  • 同源限制： worker线程运行的脚本 必须与主线程脚本文件同源(QQs按：这里应该指的是同域)
  • 无法访问dom 不能调用阻塞主线程的alert confirm等
  • 通过postmessage/onmessage与主线程通讯
  • 无法访问文件系统file：// Worker可用的Web Api

单线程和阻塞操作

异步 回调 事件队列

异步与回调并没有直接的联系，只是异步操作长需要用回调函数的方式返回数据，同步函数也可以传入function作为回调函数

与typescript集成

定义一个common module

1
2
3
4
5
6
7
8
9
// worker-loader.d.ts

declare module "worker-loader!*" {
    class WebpackWorker extends Worker {
        constructor();
    }

    export default WebpackWorker;
}

worker
1
2
3
4
5
// MyWorker.ts
const worker :Worker = self as any;
worker.postMessage({ foo: "foo"});

worker.addEventListener("message", (event)=>console.log(evnet));

调用worker
1
2
3
4
5
6
7
// index.ts
import Worker from "worker-loader!./Worker";
const worker = new Worker();

worker.postMessage({ a: 1 });
worker.onmessage = (event) => {};
worker.addEventListener("message", (event) => {})