微信小程序基础教程之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无缝滚动代码
Jan 03 Javascript
jQuery初学:find()方法及children方法的区别分析
Jan 31 Javascript
javascript中定义私有方法说明(private method)
Jan 27 Javascript
jQuery控制TR显示隐藏的几种方法
Jun 18 Javascript
JavaScript中输出标签的方法
Aug 27 Javascript
js实现文字跟随鼠标移动而移动的方法
Feb 28 Javascript
JavaScript基础知识之方法汇总结
Jan 24 Javascript
js点击文本框弹出可选择的checkbox复选框
Feb 03 Javascript
你不需要jQuery(三) 新AJAX方法fetch()
Jun 14 Javascript
Javascript 跨域知识详细介绍
Oct 30 Javascript
vue 实现在函数中触发路由跳转的示例
Sep 01 Javascript
全网小程序接口请求封装实例代码
Nov 06 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下把数组保存为文件格式的实例应用
2010/02/08 PHP
ajax php传递和接收变量实现思路及代码
2012/12/19 PHP
thinkphp框架下404页面设置 仅三步
2016/05/14 PHP
iOS+PHP注册登录系统 PHP部分(上)
2016/12/26 PHP
JavaScript Title、alt提示(Tips)实现源码解读
2010/12/12 Javascript
iframe异步加载实现点击左边菜单加载右边内容实例讲解
2013/03/04 Javascript
getJSON调用后台json数据时函数被调用两次的原因猜想
2013/09/29 Javascript
javascript获取所有同类checkbox选项(实例代码)
2013/11/07 Javascript
JavaScript的各种常见函数定义方法
2014/09/16 Javascript
浅谈JavaScript的事件
2015/02/27 Javascript
在微信、支付宝、百度钱包实现点击返回按钮关闭当前页面和窗口的方法
2016/08/05 Javascript
快速实现jQuery多级菜单效果
2017/02/01 Javascript
jQuery中实现text()的方法
2019/04/04 jQuery
[02:51]2018年度DOTA2最佳中单位选手-完美盛典
2018/12/17 DOTA
[06:57]DOTA2-DPC中国联赛 正赛 Ehome vs PSG.LGD 选手采访
2021/03/11 DOTA
python模拟Django框架实例
2016/05/17 Python
Python进阶之@property动态属性的实现
2019/04/01 Python
python set内置函数的具体使用
2019/07/02 Python
python 怎样将dataframe中的字符串日期转化为日期的方法
2019/09/26 Python
Python求解正态分布置信区间教程
2019/11/20 Python
简单了解python元组tuple相关原理
2019/12/02 Python
numpy ndarray 取出满足特定条件的某些行实例
2019/12/05 Python
TensorFlow 读取CSV数据的实例
2020/02/05 Python
python编写俄罗斯方块
2020/03/13 Python
django-csrf使用和禁用方式
2020/03/13 Python
CSS3属性box-shadow使用详细教程
2012/01/21 HTML / CSS
Bootstrap File Input文件上传组件
2020/12/01 HTML / CSS
ECCO爱步官方旗舰店:丹麦鞋履品牌
2018/01/02 全球购物
什么是设计模式
2012/06/17 面试题
六十岁生日答谢词
2014/01/10 职场文书
小学生综合素质评语
2014/04/23 职场文书
副校长个人对照检查材料思想汇报
2014/10/04 职场文书
五年级学生评语大全
2014/12/26 职场文书
二十年同学聚会感言
2015/07/30 职场文书
2019最新婚庆对联集锦!
2019/07/10 职场文书
SQL中的连接查询详解
2022/06/21 SQL Server