2024年Web前端最新前端面经 关于Web Worker，2024年最新一线互联网大厂中高级Web前端面试真题收录

最后

为了帮助大家更好的了解前端，特别整理了《前端工程师面试手册》电子稿文件。

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

worker.postMessage({

type:“command”,

message:“start your job now !”

});

主线程接收Worker线程的消息

---

主线程通过postMessage（），可以给Worker线程发送消息。同时，主线程通过wx.onmessage指定监听函数，接收Worker子线程发回来的消息。

//主线程用onmessage监听Worker子线程发回的消息

worker.onmessage = function(event){

var data = event.data;

console.log(“Data from Worker is :” + data );

doSomething();

}

function doSometiong(){

worker.postMessage(“Done Well!”); //主线程再次发消息给Worker线程

}

主线程接收Worker线程发生错误的消息

---

主线程除了用worker.onmessage监听Worker线程发回的消息，还需要监听一个比较特殊的信息：错误信息。也就是说当Worker因某种原因不能完成主线程派给它的任务，那么主线程应该知道Worker线程无法完成这个任务。

通过worker.onerror去监听Worker的error事件。

当发生error事件时，事件对象有三个属性，filename,lineno和message。

• event.filename ： 发生错误事件的文件名

• event.lineno：出错代码行号

• event.message：完整的出错信息

worker.onerror = function(event){

console.log(“Error file is :” + event.filename )

}

主线程停止Worker线程的工作

---

只需调用worker.terminate()；就可以停止Worker线程的工作。

worker.terminate();

Worker线程接收来自主线程的消息

---

主线程可以通过worker.postMessage()，将消息传递给子线程Worker线程。那在Worker线程中，就会触发messge事件。为了处理来自主线程的信息，则需要创建一个onmessage去监听信息。

self.onmessage = function(event){

var data = event.data;

// doSomething

}

除了用onmessage去指定监听函数，也可以通过addEventListener（）来指定监听函数，具体代码如下：

self.addEventListener(‘message’,function(e){

//doSomething;

},false)

//或者

this.addEventListener(‘message’,function(e){

//doSomething

},false)

//也可以

addEventListener(‘message’,function(e){

//doSomething

},false)

因为在Worker线程中，self和this都是指向Worker子线程自身，也就是全局对象。所以第三种不写self和this也是可以的。

Worker线程给主线程发送消息

---

Worker线程也需要向主线程发送消息，用self.postMessage()即可

self.onmessage = function(event){

var data = event.data;

self.postMessage(“Already Started！”);

// doSomething

}

Worker线程自我结束

---

在Worker线程中，可以调用self.close（）去主动停止工作。

self.close();

Vue 编码基础

2.1.1. 组件规范

2.1.2. 模板中使用简单的表达式

2.1.3 指令都使用缩写形式

2.1.4 标签顺序保持一致

2.1.5 必须为 v-for 设置键值 key

2.1.6 v-show 与 v-if 选择

2.1.7 script 标签内部结构顺序

2.1.8 Vue Router 规范

Vue 项目目录规范

2.2.1 基础

2.2.2 使用 Vue-cli 脚手架

2.2.3 目录说明

2.2.4注释说明

2.2.5 其他

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】