1 <!DOCTYPE html>
2 <html>
3 <head>
4 <meta charset="utf-8" />
5 <title>设计模式之单例模式</title>
6 <script src="js/zepto.min.js" type="text/javascript" charset="utf-8"></script>
7 </head>
8 <body>
9 <div id="a">a</div>
10 <div id="b">b</div>
11 <div id="c">c</div>
12 <div id="d">d</div>
13 <div id="e">e</div>
14 <div id="f">f</div>
15 </body>
16 <script type="text/javascript">
17 var top1 = {
18 init:function(){
19 this.render();
20 this.bind();
21 },
22 a:4,
23 render:function(){
24 var me = this;
25 me.btna = $("#a");
26 },
27 bind:function(){
28 var me = this;
29 me.btna.click(function(){
30 //业务逻辑取出去
31 me.test();
32 alert("top1.a--->"+top1.a);
33 alert("a--->"+a);
34 });
35 },
36 test:function(){
37 a = 5;
38 }
39 };
40 var banner = {
41 init:function(){
42 this.render();
43 this.bind();
44 },
45 a:4,
46 render:function(){
47 var me = this;
48 me.btna = $("#d");
49 },
50 bind:function(){
51 var me = this;
52 me.btna.click(function(){
53 //业务逻辑取出去
54 me.test();
55 alert("top1.a--->"+top1.a);
56 });
57 },
58 test:function(){
59 top1.a = 6;
60 }
61 };
62 top1.init();
63 banner.init();
64 </script>
65 </html>
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <meta charset="UTF-8">
5 <title></title>
6 </head>
7 <body>
8 </body>
9 <script type="text/javascript">
10 var xiaowang = (function(argument){
11 var xiaowangjia =function(message){
12 this.menling = message;
13 }
14 var men;
15 var info = {
16 sendMessage:function(message){
17 if(!men){
18 men = new xiaowangjia(message);
19 }
20 return men;
21 }
22 };
23 return info;
24 })();
25 var xiaoli = {
26 callXiaowang:function(msg){
27 var _xw = xiaowang.sendMessage(msg);
28 alert(_xw.menling);
29 _xw = null;//等待垃圾回收
30 }
31 };
32 xiaoli.callXiaowang("didi");
33 </script>
34 </html>
