设计模式之单例模式 

 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>

 

posted @ 2016-07-18 23:37  loewe0202  阅读(144)  评论(0)    收藏  举报