微信小程序基础教程之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 相关文章推荐
JavaScript对象、属性、事件手册集合方便查询
Jul 04 Javascript
jquer之ajaxQueue简单实现代码
Sep 15 Javascript
JavaScript改变HTML元素的样式改变CSS及元素属性
Nov 12 Javascript
new Date()问题在ie8下面的处理方法
Jul 31 Javascript
基于Bootstrap3表格插件和分页插件实例详解
May 17 Javascript
简单几步实现返回顶部效果
Dec 05 Javascript
js 输入框 正则表达式(菜鸟必看教程)
Feb 19 Javascript
详谈js中数组(array)和对象(object)的区别
Feb 27 Javascript
在vue项目中引入highcharts图表的方法(详解)
Mar 05 Javascript
jQuery实现的上传图片本地预览效果简单示例
Mar 29 jQuery
JavaScript面向对象的程序设计(犯迷糊的小羊)
May 27 Javascript
vue 点击其他区域关闭自定义div操作
Jul 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随机输出名人名言的代码
2012/10/07 PHP
使用php get_headers 判断URL是否有效的解决办法
2013/04/27 PHP
php中随机函数mt_rand()与rand()性能对比分析
2014/12/01 PHP
百度工程师讲PHP函数的实现原理及性能分析(一)
2015/05/13 PHP
PHP实现基于栈的后缀表达式求值功能
2017/11/10 PHP
4种Windows系统下Laravel框架的开发环境安装及部署方法详解
2020/04/06 PHP
JS动态获取当前时间,并写到特定的区域
2013/05/03 Javascript
倒记时60刷新网页的js代码
2014/02/18 Javascript
深入理解javascript变量声明
2014/11/20 Javascript
jQuery on方法传递参数示例
2014/12/09 Javascript
jQuery统计上传文件大小的方法
2015/01/24 Javascript
javascript转换静态图片,增加粒子动画效果
2015/05/28 Javascript
微信小程序使用第三方库Underscore.js步骤详解
2016/09/27 Javascript
webpack实现热加载自动刷新的方法
2017/07/30 Javascript
jquery实现用户登陆界面(示例讲解)
2017/09/06 jQuery
详解vue-cli 3.0 build包太大导致首屏过长的解决方案
2018/11/10 Javascript
vue 通过绑定事件获取当前行的id操作
2020/07/27 Javascript
ubuntu环境下python虚拟环境的安装过程
2018/01/07 Python
python合并同类型excel表格的方法
2018/04/01 Python
Python使用requests提交HTTP表单的方法
2018/12/26 Python
Python操作配置文件ini的三种方法讲解
2019/02/22 Python
python变量的存储原理详解
2019/07/10 Python
Python中bisect的使用方法
2019/12/31 Python
Node.js 和 Python之间该选择哪个?
2020/08/05 Python
简述 Python 的类和对象
2020/08/21 Python
python中用Scrapy实现定时爬虫的实例讲解
2021/01/18 Python
Europcar英国:英国汽车和货车租赁
2017/01/21 全球购物
MAC Cosmetics巴西官方网站:M·A·C彩妆
2019/04/18 全球购物
OSPREY LONDON官网:英国本土皮具品牌
2019/05/31 全球购物
后勤人员自我鉴定
2013/10/20 职场文书
自荐书封面下载
2013/11/29 职场文书
某某同志考察材料
2014/05/28 职场文书
入党政审材料范文
2014/12/24 职场文书
事业单位工作人员2015年度思想工作总结
2015/10/15 职场文书
《游戏公平》教学反思
2016/02/20 职场文书
2019财务管理制度最新范本!
2019/07/09 职场文书