在javascript中用command模式模拟多线程

        作者:emu(黄希彤)今天和徐鹏程msn的时候聊起javascript不支持多线程。以前也看过有高手在wsh上可以创建thread对象,但是毕竟不是常规手段,我们做web应用一般没有本地访问权限的,用activex的没试过,毕竟也不是javascript方式。

        以前我们解决这样的问题都是针对具体问题写一段代码来模拟多线程的,但是由于往往要对没个线程单独编码,这样的代码十分冗长。学习设计模式的时候就曾经考虑过在javascript中实用command模式来更好的模拟多线程,但是一直没有付诸实施,今天既然想起来了就试试看:

 1 < html >< head >< title > emu -- 用command模式模拟多线程 </ title ></ head >< body >
 2 < SCRIPT  LANGUAGE ="JavaScript" >
 3<!--
 4if (Array.prototype.shift==null)
 5Array.prototype.shift = function (){
 6    var rs = this[0];
 7    for (var i=1;i<this.length;i++this[i-1]=this[i]
 8    this.length=this.length-1
 9    return rs;
10}

11if (Array.prototype.push==null)
12Array.prototype.push = function (){
13    for (var i=0;i<arguments.length;i++this[this.length]=arguments[i];
14    return this.length;
15}

16
17var commandList = [];
18var nAction = 0;//控制每次运行多少个动作
19var functionConstructor = function(){}.constructor;
20function executeCommands(){
21    for (var i=0;i<nAction;i++)
22        if (commandList.length>0){
23            var command = commandList.shift();
24            if (command.constructor == functionConstructor)
25                if (command.scheduleTime == null || new Date()-command.scheduleTime>0)
26                    command();
27                else
28                    commandList.push(command);
29        }

30}

31
32function startNewTask(){
33    var resultTemp = document.getElementById("sampleResult").cloneNode(true);
34    with (resultTemp){
35    id="";style.display="block";style.color=(Math.floor(Math.random()* (1<<23)).toString(16)+"00000").substring(0,6);
36    }

37    document.body.insertBefore(resultTemp,document.body.lastChild);
38    commandList.push(function(){simThread(resultTemp,1);});
39    nAction++;
40}

41
42function  simThread(temp,n){
43    if (temp.stop) n--;
44    else temp.innerHTML = temp.innerHTML - (-n);
45    if (n<1000)
46        commandList.push(function(){simThread(temp,++n)});
47    else{
48        var command = function(){document.body.removeChild(temp);;nAction--;};
49        command.scheduleTime = new Date()-(-2000);
50        commandList.push(command);
51    }

52}

53
54window.onload = function(){setInterval("executeCommands()",1);}
55//-->
56
</ SCRIPT >
57 < button  onclick ="startNewTask()" > 开始新线程 </ button >
58
59 < BR >< BR >
60 < div  id =sampleResult  onmouseover ="this.stop=true"  onmouseout ="this.stop=false"  style ="display:none;cursor:hand" > 0 </ div >
61 </ body >
62 </ html >

        注意第26行。javascript里面函数也是对象,所以就没有必要把函数调用包装到do或者execute方法里面了,直接用()就可以让函数对象运行起来:
command();

        shift和push函数是javascript中array对象的函数,可是IE5居然没有定义,最前面两个函数是为IE5准备的。

        在IE和FireFox下面通过作者:emu(黄希彤)

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值