微信小程序基础教程之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 相关文章推荐
js动态删除div元素基本思路及实现代码
May 08 Javascript
页面刷新时记住滚动条的位置jquery代码
Jun 17 Javascript
node.js中的console.timeEnd方法使用说明
Dec 09 Javascript
node.js中的url.parse方法使用说明
Dec 10 Javascript
jQuery验证元素是否为空的两种常用方法
Mar 17 Javascript
文字垂直滚动之javascript代码
Jul 29 Javascript
Eclipse引入jquery报错如何解决
Dec 01 Javascript
jQuery+PHP实现微信转盘抽奖功能的方法
May 25 Javascript
Javascript 实现 Excel 导入生成图表功能
Oct 22 Javascript
微信小程序的开发范式BeautyWe.js入门详解
Jul 10 Javascript
9种方法优化jQuery代码详解
Feb 04 jQuery
关于AngularJS中几种Providers的区别总结
May 17 Javascript
使用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类中Static方法效率测试代码
2010/10/17 PHP
smarty模板引擎中变量及变量修饰器用法实例
2015/01/22 PHP
PHP的Yii框架中过滤器相关的使用总结
2016/03/29 PHP
PHP设计模式之原型模式定义与用法详解
2018/04/03 PHP
JS 中document.URL 和 windows.location.href 的区别
2009/11/11 Javascript
JavaScript 序列化对象实现代码
2009/12/18 Javascript
Jquery css函数用法(判断标签是否拥有某属性)
2011/05/28 Javascript
JS判断字符串长度的5个方法(区分中文和英文)
2014/03/18 Javascript
小白谈谈对JS原型链的理解
2016/05/03 Javascript
微信小程序 UI布局常用技巧整理总结
2016/12/05 Javascript
Bootstrap导航条学习使用(二)
2017/02/08 Javascript
Angularjs单选改为多选的开发过程及问题解析
2017/02/17 Javascript
Bootstrap响应式表格详解
2017/05/23 Javascript
在vue.js中抽出公共代码的方法示例
2017/06/08 Javascript
jQuery实现可拖动进度条实例代码
2017/06/21 jQuery
webpack进阶——缓存与独立打包的用法
2017/08/02 Javascript
React Native中TabBarIOS的简单使用方法示例
2017/10/13 Javascript
使用vue-router beforEach实现判断用户登录跳转路由筛选功能
2018/06/25 Javascript
NodeJS 中Stream 的基本使用
2018/07/30 NodeJs
vue图片上传本地预览组件使用详解
2019/02/20 Javascript
Vue实现固定定位图标滑动隐藏效果
2019/05/30 Javascript
js实现淘宝浏览商品放大镜功能
2020/10/28 Javascript
Python isinstance判断对象类型
2008/09/06 Python
Python模拟登陆实现代码
2017/06/14 Python
python用BeautifulSoup库简单爬虫实例分析
2018/07/30 Python
Tensorflow获取张量Tensor的具体维数实例
2020/01/19 Python
Python连接SQLite数据库并进行增册改查操作方法详解
2020/02/18 Python
DKNY品牌官网:纽约大都会时尚风格
2016/10/20 全球购物
文秘专业自荐信
2013/10/14 职场文书
教师的实习自我鉴定
2013/12/17 职场文书
大学活动邀请函
2014/01/28 职场文书
小学英语课后反思
2014/04/26 职场文书
合法的离婚协议书范本
2014/10/23 职场文书
公司借条范本
2015/05/25 职场文书
创业计划书之零食店(进口)
2019/09/24 职场文书
导游词之张家界
2019/10/31 职场文书