js的单例写法 JS单例模式 你是?(单例) 你是?(普通) [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]loop.js是一个单例模式的js类://一开始就用new 无名类的方式创建。这样就实现了单例的功能。var loop = new (function(){ // 外部公共函数 // 无限循环的操作 this.setloop = function(fn){Infinite_loop.setLoopFn(fn);} // 参数 1 参数类型 function this.deleteloop = function(fn){Infinite_loop.deleteLoopFn(fn);} // 参数 1 参数类型 function this.stoploop = function(){Infinite_loop.stopLoop();} // 单次循环的操作 this.setloopOne = function(fn){one_loop.setLoopOneFn(fn);} // 参数 1 参数类型 function this.stoploopOne = function(){one_loop.stopLoopOne();} // 下面是两个私有的单例模式成员 // 无限循环执行的List对象 var Infinite_loop = new (function(){ this.loop_stop = true; this.loop_action = new Array(); this.loop_actionID = 0; var opp = this; this.setLoopFn = function(fn){ if(typeof(fn)!="function"){ throw new Error("window.loop.setloop's argment is not a function!"); return; } for(var i=0;i<this.loop_action.length;i++){ if(this.loop_action[i] == fn){ throw new Error(fn+" has been registered !"); return; } } this.loop_action.push(fn); this.startLoop(); }; this.deleteLoopFn = function(fn){ for(var i=0;i<this.loop_action.length;i++){ if(this.loop_action[i] == fn){ this.loop_action.splice(i,1); } } }; this.Loop = function(){ var run = function(){ if(opp.loop_action.length > 0){ (opp.loop_action[opp.loop_actionID])(); opp.loop_actionID++; if(opp.loop_actionID>=opp.loop_action.length)opp.loop_actionID=0; setTimeout(opp.Loop,); return; } opp.loop_stop = true; }; run(); } this.stopLoop = function(){ this.loop_stop = true; } this.startLoop = function(){ if(! this.loop_stop)return; this.loop_stop = false; this.Loop(); } })(); /* 单次执行的list对象 */ var one_loop = new (function(){ this.loopOne_stop = true; this.loopOne_action = new Array(); var opp = this; this.setLoopOneFn = function(fn){ if(typeof(fn)!="function"){ throw new Error("window.loop.setloopOne's argment is not a function!"); return; } this.loopOne_action.push(fn); this.startLoopOne(); } this.LoopOne = function(){ function run(){ if(opp.loopOne_action.length>0 && !opp.loopOne_stop){ (opp.loopOne_action.shift())(); setTimeout(opp.LoopOne,); return; } opp.loopOne_stop = true; } run(); } this.stopLoopOne = function(){ this.loopOne_stop = true; } this.startLoopOne = function(){ if(! this.loopOne_stop)return; this.loopOne_stop = false; this.LoopOne(); } })();})();下面是实例:loop.html<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " xmlns=" http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>loop.js</title><script type="text/javascript" src="jquery.js"></script><script type="text/javascript" src="loop.js"></script><script type="text/javascript">function moveLayer1(){ this.moveleft = true; this.movedown = true; this.x1 = this.y1 = ; this.x2 = ; this.y2 = ;}moveLayer1.prototype.move = function(){ var divLayer1 = document.getElementById("Layer1"); var l = parseInt(divLayer1.style.left), t = parseInt(divLayer1.style.top); var r = parseInt(Math.random()*); if(l < this.x2 && this.moveleft){ l+=1+r; if(l>this.x2-1)this.moveleft = false; }else if(l > this.x1 && ! this.moveleft){ l-=1+r; if(l < this.x1+1)this.moveleft = true; } if(t < this.y2 && this.movedown){ t+=1+r; if(t>this.y2-1)this.movedown = false; }else if(t > this.y1 && ! this.movedown){ t-=1+r; if(t < this.y1+1)this.movedown = true; } divLayer1.style.left =l+"px"; divLayer1.style.top = t+"px";}function circle(){ this.r = ; this.rx = ; this.ry = ; this.x; this.y; this.angle = 0; this.speedAngle = ;}circle.prototype.init = function(){ this.setXY(); $("body").append('<div id="cd" class="Layer2" style="left:'+this.x+'px;top:'+this.y+'px;"><img src="testFile/glass_x.gif" /></div>'); $("body").append('<div class="Layer1" style="left:'+this.rx+'px;top:'+this.ry+'px;"></div>');}circle.prototype.setXY = function(){ this.x = this.rx + this.r*Math.cos(this.angle/(/Math.PI)); this.y = this.ry + this.r*Math.sin(this.angle/(/Math.PI));}circle.prototype.draw = function(){ this.angle +=this.speedAngle; this.setXY(); var f = document.getElementById("cd"); //$("body").append($("#cd").clone()); f.style.left =this.x+"px"; f.style.top = this.y+"px";}function timetable(){var f = document.getElementById("daa");var d = new Date();f.innerHTML = "现在时间:"+d.getUTCFullYear()+"年"+d.getUTCMonth()+"月"+d.getUTCDate()+"日 星期"+d.getUTCDay()+" "+d.getUTCHours()+":"+d.getUTCMinutes()+":"+d.getUTCSeconds();}var lenstr = -1;function prints(){ var str = document.getElementById("sourse").innerHTML; if(lenstr<str.length){ lenstr++; var f = document.getElementById("prin"); //if(lenstr%==0)f.innerHTML +="<br />"; f.innerHTML += str.charAt(lenstr); }else{ loop.deleteloop(prints); }}var movediv = new moveLayer1();function imgMove(){movediv.move();}var mycircle = new circle();function drawCircle(){mycircle.draw();}function winInit(){mycircle.init();loop.setloop(drawCircle);loop.setloop(imgMove);loop.setloop(timetable);loop.setloop(prints);}</script><style type="text/css"><!--.Layer1 { position:absolute; overflow:hidden; color:#fff; width:px; height:px; z-index:;}.Layer2 { position:absolute; overflow:hidden; color:#fff; width:px; height:px; z-index:1;}--></style></head><body onload="winInit();"><div id="daa"></div><div id="Layer1" class="Layer1" style="left:px; top:px;"><img src="testFile/glass_x.gif" name="mimg" width="" height="" id="mimg" /></div><pre id="prin"></pre><div id="sourse" style="display:none"> var x = 1; var y = 2; var z = 3; var sum; function Plus(a, b) { var z = 0; var i = 0; for (i = 0; i < arguments.length; i++) { z += arguments[i]; } setTimeout( function() {alert(z);}, ); //可以带变量参数的setTimeout调用形式 return z; } setTimeout( function(){ sum = Plus(x, y, z); }, ); /*除了可以带变量参数还可以获取返回值的setTimeout调用形式*/</div></body></html>jquery.jsjQuery 是1.2.6版的,小巧的js框架,可以到 money = factory.creater ("美元");
推荐整理分享javascript 单例模式演示代码 javascript面向对象编程(js编写一个标准的单例模式类),希望有所帮助,仅作参考,欢迎阅读内容。
![javascript 单例模式演示代码 javascript面向对象编程(js编写一个标准的单例模式类)](https://www.jiuchutong.com/image/20240129/1706507805.jpg)
文章相关热门搜索词:单例模式前端,js class 单例,js中单例模式,js中单例模式,js编写一个标准的单例模式类,js编写一个标准的单例模式类,js单例模式应用场景,js单例模式,内容如对您有帮助,希望把文章链接给更多的朋友!
JavaScript 设计模式之组合模式解析 怎么说呢?!就像是动物(组合对象)一样,当它生下后代(叶对象)时,它的后代就有了某种功能(比如:挖洞,听力好等等);也像是一棵树,它
javascript 对象入门实例教程 1:构造函数法[Ctrl+A全选注:如需引入外部Js需刷新才能执行]注解:1:这里定义了一个Dog对象(在javascript中,函数就是对象,这里functionDog(name,weight)同时
JavaScript之信息的封装 js对象入门 JavaScript之信息的封装在编码前,我们需要了解如下几个术语;封装:对内部数据的表现形式和实施细节进行隐藏;私有属性和方法:外界只能通过其公