简单实现一个 js 多线程

面试 专栏收录该内容
19 篇文章 2 订阅
  • 简单实现一个 js 的多线程执行和多线程之间数据的传递
    • JS作为脚本语言,它的主要用途是与用户互动,以及操作DOM。这决定了它只能是单线程,否则会带来很复杂的同步问题。(这里这些问题我们不做研究)
    • 但是单线程的语言,有一个很致命的确定。如果说一个脚本语言在执行时,其中某一块的功能在执行时耗费了大量的时间,那么就会造成阻塞。这样的项目,用户体验是非常差的,所以这种现象在项目的开发过程中是不允许存在的。
    • 其实JS为我们提供了一个Worker的类,它的作用就是为了解决这种阻塞的现象。当我们使用这个类的时候,它就会向浏览器申请一个新的线程。这个线程就用来单独执行一个js文件。
<script>
	var worker = new Worker(js文件路径);
	<-- 那么这个语句就会申请一个线程用来执行这个js文件。当然,在主线程中有一些方法来实现对新线程的控制和数据的接收。在这里,我们只说比较常用的几个方法。-->

	//postMessage(msg);
	//postMessage方法把在新线程执行的结果发送到浏览器的js引擎线程里
	worker.onmessage = function(){
	//获取在新线程中执行的js文件发送的数据 用event.data接收数据
    	console.log( event.data )
	};
	setTimeout( function(){
    	worker.terminate();
    	//terminate方法用于关闭worker线程
	},2000)
	setTimeout( function(){
    	worker = new Worker("js/ccc.js");
		//再次开启worker线程
	},3000)
</script>
  • 在新线程中使用postMessage()方法可以向主线程中发送一些数据,主线程中使用worker的onmessage事件来接收这些数据,这样就实现了js的多线程执行和多线程之间数据的传递。
  • 3
    点赞
  • 0
    评论
  • 10
    收藏
  • 一键三连
    一键三连
  • 扫一扫,分享海报

©️2021 CSDN 皮肤主题: 创作都市 设计师:CSDN官方博客 返回首页
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值