微信小程序基础教程之worker线程的使用方法


Posted in Javascript onJuly 15, 2019

前言

我们知道js是单线程的,在有时候需要处理一些密集计算或者是高延迟的时候,总会出现不便。而且,现在的cpu都是多核的,单线程也无法充分发挥电脑的计算能力。正是基于这种情况,才有了worker的诞生。由于微信小程序官方的教程比较看不懂...所以本篇主要介绍一下worker在小程序中的用法。

worker的一些说明

本篇主要是在小程序中使用worker,因为说明部分也是和小程序相关。

1、主线程和worker线程之间是通过消息来通信的,主线程不能直接调用worker线程中的函数

2、worker线程中不能使用使用wx系列的api。

步骤说明

小程序中,worker用法主要分为3步(按我个人的划分),分别是:配置、主线程中创建调用和销毁、worker线程中实现。

步骤一:配置

在app.json中配置worker目录,如下图(具体需要自己一一对应目录)

微信小程序基础教程之worker线程的使用方法

步骤二:主线程中创建调用和销毁

这一步需要注意的就是,创建时填写的是绝对路径,其他基本没什么问题。例如以下代码,我们创建了worker线程,并向其发送了1个对象,对象中x=10和y=2。然后在接收到worker线程的消息时,打印出来。

// welcome.js
 onLoad: function (options) {

  const worker = wx.createWorker('/worker/myworker.js');
  worker.postMessage({
   x : 10,
   y : 2
  });

  worker.onMessage(function(res){
   console.log('这是主线程打印的')
   console.log(res)
  });
  
 },

worker线程中实现

worker中其实是默认注入了一个叫worker的对象,直接调用监听消息和发送消息即可。如以下代码:

// myworker.js
worker.onMessage(function(res){
 console.log('这是worker内部线程打印的')
 console.log(res)
 let sum = add(res.x,res.y);
 worker.postMessage({
  sum : sum
 })
});

function add(x,y){
 return x+y;
}

打印代码如下图:

微信小程序基础教程之worker线程的使用方法

小结

worker使用方法就是这样了,一般来说密集计算和高延迟的代码片段我们会放入其中,其他的话在主线程直接执行就好了。

好的,以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,谢谢大家对三水点靠木的支持。

Javascript 相关文章推荐
文本框根据输入内容自适应高度的代码
Oct 24 Javascript
js获取php变量的实现代码
Aug 10 Javascript
Javscript删除数组中指定元素并返回新数组
Mar 06 Javascript
node.js中的定时器nextTick()和setImmediate()区别分析
Nov 26 Javascript
JavaScript中停止执行setInterval和setTimeout事件的方法
May 14 Javascript
省市区三级联动下拉框菜单javascript版
Aug 11 Javascript
JQUERY的AJAX请求缓存里的数据问题处理
Feb 23 Javascript
Angular2表单自定义验证器的实现
Oct 19 Javascript
通过fastclick源码分析彻底解决tap“点透”
Dec 24 Javascript
JavaScript设计模式之观察者模式(发布订阅模式)原理与实现方法示例
Jul 27 Javascript
element-ui中el-upload多文件一次性上传的实现
Dec 02 Javascript
详细聊聊vue中组件的props属性
Nov 02 Vue.js
使用vue-router在Vue页面之间传递数据的方法
Jul 15 #Javascript
微信小程序在其他页面监听globalData中值的变化
Jul 15 #Javascript
vue中filters 传入两个参数 / 使用两个filters的实现方法
Jul 15 #Javascript
微信小程序全局变量改变监听的实现方法
Jul 15 #Javascript
vue draggable resizable 实现可拖拽缩放的组件功能
Jul 15 #Javascript
微信小程序如何使用canvas二维码保存至手机相册
Jul 15 #Javascript
如何给element添加一个抽屉组件的方法步骤
Jul 14 #Javascript
You might like
PHP 写文本日志实现代码
2010/05/18 PHP
php实现12306余票查询、价格查询示例
2014/04/17 PHP
php网站被挂木马后的修复方法总结
2014/11/06 PHP
php基于mcrypt_encrypt和mcrypt_decrypt实现字符串加密解密的方法
2016/07/12 PHP
php实现的pdo公共类定义与用法示例
2017/07/19 PHP
6个常见的 PHP 安全性攻击实例和阻止方法
2020/12/16 PHP
JavaScript面向对象编程
2008/03/02 Javascript
jQuery 相关控件的事件操作分解
2009/08/03 Javascript
js验证是否为数字的总结
2013/04/14 Javascript
js传参数受特殊字符影响错误的解决方法
2013/10/21 Javascript
javascript操作excel生成报表全攻略
2014/05/04 Javascript
Javascript验证Visa和MasterCard信用卡号的方法
2015/07/27 Javascript
Angularjs 制作购物车功能实例代码
2016/09/14 Javascript
Node.js中常规的文件操作总结
2016/10/13 Javascript
详解如何在Angular中快速定位DOM元素
2017/05/17 Javascript
基于VUE移动音乐WEBAPP跨域请求失败的解决方法
2018/01/16 Javascript
vue fetch中的.then()的正确使用方法
2020/04/17 Javascript
es6函数之箭头函数用法实例详解
2020/04/25 Javascript
python实现dnspod自动更新dns解析的方法
2014/02/14 Python
python操作mysql中文显示乱码的解决方法
2014/10/11 Python
处理Python中的URLError异常的方法
2015/04/30 Python
Python中IPYTHON入门实例
2015/05/11 Python
Windows下Eclipse+PyDev配置Python+PyQt4开发环境
2016/05/17 Python
攻击者是如何将PHP Phar包伪装成图像以绕过文件类型检测的(推荐)
2018/10/11 Python
使用python 写一个静态服务(实战)
2019/06/28 Python
环法自行车赛官方商店:Le Tour de France
2017/08/27 全球购物
小区门卫管理制度
2014/01/29 职场文书
护理专科学生自荐书
2014/07/05 职场文书
商场消防安全责任书
2014/07/29 职场文书
出售房屋协议书范本
2014/10/06 职场文书
2015年百日安全活动总结
2015/03/26 职场文书
不服劳动仲裁起诉书
2015/05/20 职场文书
化工生产实习心得体会
2016/01/22 职场文书
你会写报告?产品体验报告到底该怎么写?
2019/08/14 职场文书
JavaScript 语句之常用 for 循环详解
2021/03/29 Javascript
SQL Server代理:理解SQL代理错误日志处理方法
2021/06/30 SQL Server