JS实现多线程--Concurrent.Thread.js

前言

js是单线程语言，但前端的某些任务是非常耗时的，如果让它们老老实实的排队等待执行的话，执行效率会非常的低，甚至导致页面的假死。

单线程就如同只有一个档口，上面的烦恼，我们通常会这样去处理，先让赶时间且需求小的人优先。这时我们可以使用setTimeout，跟需求量超大，又不着急的人约个时间，让他晚些再来。

诸如setTimeout等方式，确实可以帮我们解决眼瞎麻烦。但也不能尽善尽美，诸如上面的烦恼，与【客人A】约的时间，短了 可能来的时候【客人E】还未完成。长了难免造成时间的浪费。（此处其实可以用异步、回调解决。异步和回调此处不做详细说明，因为我也不会。）

Concurrent.Thread.js

对于我这种新手而言，单线程的JS要完成某些事件的先后处理确实是很大的烦恼。于是在网上找啊找，找到了关于Concurrent.Thread的介绍
https://www.cnblogs.com/woodk/articles/5199536.html

Concurrent.Thread.js来源于一个日本人，谁谁谁我不知道。用来让javascript也进行多线程开发的包，可以让我们将耗时的任务利用前端来模拟多线程。

操作起来也很简单很容易理解
Concurrent.Thread.create()即是开了一个线程;
下面是一个简单的例子：

<meta charset="utf-8" />
<script src="Concurrent.Thread.js"></script>
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>

<div id="test">
    hellow word!
</div>
<script>
	console.log( getNowFormatDate() + "正常程序开头");
	var a = 0;
	
    Concurrent.Thread.create(function(){
		console.log(getNowFormatDate() + "线程1开始");
		while(true)
		{
			//console.log(a);
			if(a > 99999)
			{
				break;
			}
		}
		console.log(getNowFormatDate() + "线程1结束");
    });
	
	Concurrent.Thread.create(function(){
		console.log(getNowFormatDate() + "线程2开始");
		for(var i = 0;i < 1000000;i++){
            a += 1;
        }
		console.log(getNowFormatDate() + "线程2结束");
    });
	console.log(getNowFormatDate() + "正常程序结尾");

	
	
	function getNowFormatDate() {
		var date = new Date();
		var seperator1 = "-";
		var seperator2 = ":";
		var month = date.getMonth() + 1;
		var strDate = date.getDate();
		if (month >= 1 && month <= 9) {
			month = "0" + month;
		}
		if (strDate >= 0 && strDate <= 9) {
			strDate = "0" + strDate;
		}
		var currentdate = date.getFullYear() + seperator1 + month + seperator1 + strDate
				+ " " + date.getHours() + seperator2 + date.getMinutes()
				+ seperator2 + date.getSeconds();
		return currentdate;
	}
</script>

若按照单线程的理解，程序先后顺序会是

正常程序开头
	线程1开始
	线程2开始
	线程1结束
	线程2结束
正常程序结尾

但实际的顺序则是多线程的结果

正常程序开头
正常程序结尾
	线程1开始
	线程2开始
	线程1结束
	线程2结束

附加下载地址
https://download.csdn.net/download/sinat_37958531/10940562