web worker不能传递函数,怎么办?动态函数

需求

最近遇到一个需求,需要把用户自定义的函数(不用考虑执行函数的安全性)丢到worker中执行,但是postMessage时不能传递函数,所以要解决这个问题。

办法

解决办法:1、在postMessage时传递foo函数体字符串。2、在子线程接收后用new Function动态函数还原foo函数。

代码如下:

主线程:调用toString()拿到函数体的字符串,然后postMessage传递给子线程。

javascript 复制代码
function foo(a,b){
   console.log(a,b)
}
// 将函数转换为字符串
const fooString = foo.toString();

// 创建 Worker
const worker = new Worker('worker.js');

// 发送函数字符串和参数到 Worker
worker.postMessage({
  functionString: fooString
});

worker线程:拿到函数体字符串后通过new Function还原函数。

javascript 复制代码
self.onmessage = function(e) {
  const { functionString} = e.data;
  
  // 重新创建函数
  const foo = new Function(`return ${functionString}`)();
  
  // 在worker线程中执行函数
  foo.apply(null, [1,2]);
};

后续就可以直接调用这个函数了。

END

相关推荐
李李李勃谦14 分钟前
鸿蒙PC配色方案工具:取色、配色生成与 CSS 导出
前端·css·华为·harmonyos
threelab20 分钟前
Three.js 咖啡杯烟雾效果 | 三维可视化 / AI 提示词
开发语言·javascript·人工智能
初心未改HD33 分钟前
gRPC 与 Protobuf 实战指南
开发语言·golang
Jul1en_39 分钟前
Claude 迁移 Codex 工作流迁移与更新
java·服务器·前端·后端·ai编程
Heo42 分钟前
14_React 中的更新队列 updateQueue
前端·javascript·面试
前端 贾公子1 小时前
解决浏览器端 globalThis is not defined 报错
前端·javascript·vue.js
宁雨桥1 小时前
前端与AI结合实战分享
前端·人工智能
2zcode1 小时前
基于MATLAB的交通流量预测模型设计与实现
开发语言·matlab·交通流量预测
早日退休!!!1 小时前
操作系统锁
java·开发语言
lsx2024061 小时前
Python 统计学基础与高级应用
开发语言