javascript 單例模式演示代碼 javascript面向?qū)ο缶幊?/h1>
更新時間:2010年04月09日 10:40:54 作者:
單例模式的好處就是:類只實(shí)例化一次,省資源,節(jié)省開銷,提高速度,學(xué)習(xí)js面向?qū)ο缶幊痰呐笥芽梢詤⒖枷隆?/div>
js的單例寫法
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]
loop.js是一個單例模式的js類:
//一開始就用new 無名類的方式創(chuàng)建。這樣就實(shí)現(xiàn)了單例的功能。
var loop = new (function(){
// 外部公共函數(shù)
// 無限循環(huán)的操作
this.setloop = function(fn){Infinite_loop.setLoopFn(fn);} // 參數(shù) 1 參數(shù)類型 function
this.deleteloop = function(fn){Infinite_loop.deleteLoopFn(fn);} // 參數(shù) 1 參數(shù)類型 function
this.stoploop = function(){Infinite_loop.stopLoop();}
// 單次循環(huán)的操作
this.setloopOne = function(fn){one_loop.setLoopOneFn(fn);} // 參數(shù) 1 參數(shù)類型 function
this.stoploopOne = function(){one_loop.stopLoopOne();}
// 下面是兩個私有的單例模式成員
// 無限循環(huán)執(zhí)行的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,20);
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();
}
})();
/* 單次執(zhí)行的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,20);
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();
}
})();
})();
下面是實(shí)例:loop.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta 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 = 100
this.y1 = 100;
this.x2 = 800;
this.y2 = 400;
}
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()*20);
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 = 50;
this.rx = 500;
this.ry = 500;
this.x;
this.y;
this.angle = 0;
this.speedAngle = 10;
}
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_32x32.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/(180/Math.PI));
this.y = this.ry + this.r*Math.sin(this.angle/(180/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 = "現(xiàn)在時間:"+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%100==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:50px;
height:50px;
z-index:50;
}
.Layer2 {
position:absolute;
overflow:hidden;
color:#fff;
width:40px;
height:40px;
z-index:1;
}
-->
</style>
</head>
<body onload="winInit();">
<div id="daa"></div>
<div id="Layer1" class="Layer1" style="left:190px; top:101px;">
<img src="testFile/glass_32x32.gif" name="mimg" width="40" height="40" 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);}, 6000); //可以帶變量參數(shù)的setTimeout調(diào)用形式
return z;
}
setTimeout( function(){ sum = Plus(x, y, z); }, 3000);
/*除了可以帶變量參數(shù)還可以獲取返回值的setTimeout調(diào)用形式*/
</div>
</body>
</html>
jquery.js
jQuery 是1.2.6版的,小巧的js框架,可以到http://jquery.com/下載
testFile/glass_32x32.gif

其實(shí)大家可以再深入思考一下,
例如模擬一個簡單工廠類的東西。
var money = factory.creater ("美元");
您可能感興趣的文章:- js單例模式的兩種方案
- JS實(shí)現(xiàn)單例模式的6種方案匯總
- JavaScript的單例模式 (singleton in Javascript)
- 輕松掌握J(rèn)avaScript單例模式
- [js高手之路]單例模式實(shí)現(xiàn)模態(tài)框的示例
- JavaScript設(shè)計模式之策略模式詳解
- javascript設(shè)計模式--策略模式之輸入驗(yàn)證
- JavaScript設(shè)計模式之策略模式實(shí)例
- 學(xué)習(xí)JavaScript設(shè)計模式之策略模式
- 學(xué)習(xí)JavaScript設(shè)計模式(策略模式)
- javascript單例模式與策略模式實(shí)例詳解
相關(guān)文章
-
javascript 面向?qū)ο缶幊袒A(chǔ):繼承
"繼承是面向?qū)ο箝_發(fā)的又一個重要概念,它可以將現(xiàn)實(shí)生活的概念對應(yīng)帶程序邏輯中"?!? 雖然在JavaScript中沒有專門的機(jī)制來實(shí)現(xiàn)類的繼承,但可以通過拷貝一個類的prototype 到另外一個類來實(shí)現(xiàn)繼承”。 2009-08-08
-
JavaScript對象鏈?zhǔn)讲僮鞔a(jquery)
自從使用了jQuery以后,對它的鏈?zhǔn)讲僮骱苁且蕾?,以至于常常覺得其他庫不好用。。 2010-07-07
-
javascript 面向?qū)ο缶幊袒A(chǔ) 多態(tài)
javascript 面向?qū)ο缶幊袒A(chǔ) 多態(tài) 的實(shí)現(xiàn)方法說明,大家可以看下下面的代碼。 2009-08-08
-
JavaScript為對象原型prototype添加屬性的兩種方式
為對象原型prototype添加屬性的的方法, 需要的朋友可以參考下。 2010-08-08
-
javascript 模式設(shè)計之工廠模式學(xué)習(xí)心得
接口的實(shí)現(xiàn),從而使不同子類可以被同等的對待,恰當(dāng)?shù)氖褂霉S模式,但不要拘泥與形式,理解本質(zhì)。 2010-04-04
-
Javascript面向?qū)ο缶幊蹋ㄈ?非構(gòu)造函數(shù)的繼承
這個系列的第一部分介紹了"封裝",第二部分介紹了使用構(gòu)造函數(shù)實(shí)現(xiàn)"繼承"。
2011-08-08
-
JavaScript的單例模式 (singleton in Javascript)
JavaScript的單例模式 (singleton in Javascript) 2010-06-06
最新評論
js的單例寫法
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]
loop.js是一個單例模式的js類:
//一開始就用new 無名類的方式創(chuàng)建。這樣就實(shí)現(xiàn)了單例的功能。
var loop = new (function(){
// 外部公共函數(shù)
// 無限循環(huán)的操作
this.setloop = function(fn){Infinite_loop.setLoopFn(fn);} // 參數(shù) 1 參數(shù)類型 function
this.deleteloop = function(fn){Infinite_loop.deleteLoopFn(fn);} // 參數(shù) 1 參數(shù)類型 function
this.stoploop = function(){Infinite_loop.stopLoop();}
// 單次循環(huán)的操作
this.setloopOne = function(fn){one_loop.setLoopOneFn(fn);} // 參數(shù) 1 參數(shù)類型 function
this.stoploopOne = function(){one_loop.stopLoopOne();}
// 下面是兩個私有的單例模式成員
// 無限循環(huán)執(zhí)行的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,20);
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();
}
})();
/* 單次執(zhí)行的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,20);
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();
}
})();
})();
下面是實(shí)例:loop.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta 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 = 100
this.y1 = 100;
this.x2 = 800;
this.y2 = 400;
}
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()*20);
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 = 50;
this.rx = 500;
this.ry = 500;
this.x;
this.y;
this.angle = 0;
this.speedAngle = 10;
}
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_32x32.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/(180/Math.PI));
this.y = this.ry + this.r*Math.sin(this.angle/(180/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 = "現(xiàn)在時間:"+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%100==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:50px;
height:50px;
z-index:50;
}
.Layer2 {
position:absolute;
overflow:hidden;
color:#fff;
width:40px;
height:40px;
z-index:1;
}
-->
</style>
</head>
<body onload="winInit();">
<div id="daa"></div>
<div id="Layer1" class="Layer1" style="left:190px; top:101px;">
<img src="testFile/glass_32x32.gif" name="mimg" width="40" height="40" 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);}, 6000); //可以帶變量參數(shù)的setTimeout調(diào)用形式
return z;
}
setTimeout( function(){ sum = Plus(x, y, z); }, 3000);
/*除了可以帶變量參數(shù)還可以獲取返回值的setTimeout調(diào)用形式*/
</div>
</body>
</html>
jquery.js
jQuery 是1.2.6版的,小巧的js框架,可以到http://jquery.com/下載
testFile/glass_32x32.gif

其實(shí)大家可以再深入思考一下,
例如模擬一個簡單工廠類的東西。
var money = factory.creater ("美元");
//一開始就用new 無名類的方式創(chuàng)建。這樣就實(shí)現(xiàn)了單例的功能。
var loop = new (function(){
// 外部公共函數(shù)
// 無限循環(huán)的操作
this.setloop = function(fn){Infinite_loop.setLoopFn(fn);} // 參數(shù) 1 參數(shù)類型 function
this.deleteloop = function(fn){Infinite_loop.deleteLoopFn(fn);} // 參數(shù) 1 參數(shù)類型 function
this.stoploop = function(){Infinite_loop.stopLoop();}
// 單次循環(huán)的操作
this.setloopOne = function(fn){one_loop.setLoopOneFn(fn);} // 參數(shù) 1 參數(shù)類型 function
this.stoploopOne = function(){one_loop.stopLoopOne();}
// 下面是兩個私有的單例模式成員
// 無限循環(huán)執(zhí)行的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,20);
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();
}
})();
/* 單次執(zhí)行的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,20);
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();
}
})();
})();
下面是實(shí)例:loop.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta 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 = 100
this.y1 = 100;
this.x2 = 800;
this.y2 = 400;
}
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()*20);
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 = 50;
this.rx = 500;
this.ry = 500;
this.x;
this.y;
this.angle = 0;
this.speedAngle = 10;
}
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_32x32.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/(180/Math.PI));
this.y = this.ry + this.r*Math.sin(this.angle/(180/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 = "現(xiàn)在時間:"+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%100==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:50px;
height:50px;
z-index:50;
}
.Layer2 {
position:absolute;
overflow:hidden;
color:#fff;
width:40px;
height:40px;
z-index:1;
}
-->
</style>
</head>
<body onload="winInit();">
<div id="daa"></div>
<div id="Layer1" class="Layer1" style="left:190px; top:101px;">
<img src="testFile/glass_32x32.gif" name="mimg" width="40" height="40" 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);}, 6000); //可以帶變量參數(shù)的setTimeout調(diào)用形式
return z;
}
setTimeout( function(){ sum = Plus(x, y, z); }, 3000);
/*除了可以帶變量參數(shù)還可以獲取返回值的setTimeout調(diào)用形式*/
</div>
</body>
</html>
jquery.js
jQuery 是1.2.6版的,小巧的js框架,可以到http://jquery.com/下載
testFile/glass_32x32.gif

其實(shí)大家可以再深入思考一下,
例如模擬一個簡單工廠類的東西。
var money = factory.creater ("美元");
您可能感興趣的文章:
- js單例模式的兩種方案
- JS實(shí)現(xiàn)單例模式的6種方案匯總
- JavaScript的單例模式 (singleton in Javascript)
- 輕松掌握J(rèn)avaScript單例模式
- [js高手之路]單例模式實(shí)現(xiàn)模態(tài)框的示例
- JavaScript設(shè)計模式之策略模式詳解
- javascript設(shè)計模式--策略模式之輸入驗(yàn)證
- JavaScript設(shè)計模式之策略模式實(shí)例
- 學(xué)習(xí)JavaScript設(shè)計模式之策略模式
- 學(xué)習(xí)JavaScript設(shè)計模式(策略模式)
- javascript單例模式與策略模式實(shí)例詳解
相關(guān)文章
javascript 面向?qū)ο缶幊袒A(chǔ):繼承
"繼承是面向?qū)ο箝_發(fā)的又一個重要概念,它可以將現(xiàn)實(shí)生活的概念對應(yīng)帶程序邏輯中"?!? 雖然在JavaScript中沒有專門的機(jī)制來實(shí)現(xiàn)類的繼承,但可以通過拷貝一個類的prototype 到另外一個類來實(shí)現(xiàn)繼承”。2009-08-08JavaScript對象鏈?zhǔn)讲僮鞔a(jquery)
自從使用了jQuery以后,對它的鏈?zhǔn)讲僮骱苁且蕾?,以至于常常覺得其他庫不好用。。2010-07-07javascript 面向?qū)ο缶幊袒A(chǔ) 多態(tài)
javascript 面向?qū)ο缶幊袒A(chǔ) 多態(tài) 的實(shí)現(xiàn)方法說明,大家可以看下下面的代碼。2009-08-08JavaScript為對象原型prototype添加屬性的兩種方式
為對象原型prototype添加屬性的的方法, 需要的朋友可以參考下。2010-08-08javascript 模式設(shè)計之工廠模式學(xué)習(xí)心得
接口的實(shí)現(xiàn),從而使不同子類可以被同等的對待,恰當(dāng)?shù)氖褂霉S模式,但不要拘泥與形式,理解本質(zhì)。2010-04-04Javascript面向?qū)ο缶幊蹋ㄈ?非構(gòu)造函數(shù)的繼承
這個系列的第一部分介紹了"封裝",第二部分介紹了使用構(gòu)造函數(shù)實(shí)現(xiàn)"繼承"。2011-08-08JavaScript的單例模式 (singleton in Javascript)
JavaScript的單例模式 (singleton in Javascript)2010-06-06