工作者线程系列：第一回

本文介绍前端开发中，工作者线程相关的基础知识

我们一直都说js是一个单线程语言，这话没错，但又不失完全正确。因为当今的js，已经有了开线程干活的概念。就是说，当某些运算我们呢觉得会耗时较长，严重影响应用性能时，这种操作完全可以开启一个完全独立的线程环境，扔给他一坨数据后转头执行后续任务，然后等到那坨数据被处理好后，拿到输出结果再做进一步的操作。注意：独立线程的处理和当前主线程的执行可以理解为并行的。

官方定义：使用工作者线程，浏览器可以在原始页面环境之外，再分配一个完全独立的二级子环境。这个子环境不能与依赖单线程交互的API互操作（如dom）。但可以与父环境并行执行代码。

工作者线程:目下包含了三种

专用工作者线程， web worker
共享工作者线程
服务工作者线程

专用工作者线程

数据的传输有三种情况

结构化克隆算法。当我们用postMessage传输对象时，浏览器会遍历该对象，并在目标上下文生成一个他目标的副本，说白了深拷贝了一份数据。
可转移对象。主线程将对象给到线程后，主线程的该数据被清除，线程环境创建了一个该数据对象。说白了就是一份数据。
SharedArrayBuffer，被屏蔽咱不介绍。

样例代码：

<script>
    const worker = new Worker('http://127.0.0.1:5500/src/myWorker.js')
    worker.postMessage('alloha')
    worker.onmessage = (data) => {
        console.log('主线程接收数据>>>', data)
    }
    console.log('11111111111111')
</script>
...
...
// myWorker.js
self.onmessage = (msg) => {
    console.log('worker接受数据>>', msg)
    self.postMessage('dddd')
}

控制台打印:
图片描述