zoukankan      html  css  js  c++  java
  • JavaScript设计模式-6.封装

      1 <!DOCTYPE html>
      2 <html>
      3     <head>
      4         <meta charset="UTF-8">
      5         <title>javascript高级语法6-封装</title>
      6     </head>
      7     <body>
      8         <script>
      9         /*
     10          * 信息的隐藏是最终的目的,封装只不过是隐藏的一种方法
     11          */
     12         
     13         function demo1(){
     14         (function(){
     15             /*类的定义形式:
     16              * 1.门户大开类型
     17              * 2.命名规范区别私有和公有方式
     18              * 3.闭包
     19              */
     20             
     21             //门户大开型
     22             function Person(age,name){
     23                 this.name = name;
     24                 if(!this.checkAge(age)){
     25                     throw new Error("年龄必须在0-150之间")
     26                 }
     27                 this.age = age;
     28             }
     29 //            var p = new Person(-10,"jim");
     30     //        alert(p.name+"  "+p.age); //年龄-10,不符合常规
     31             //解决上述问题
     32             Person.prototype = {
     33                 checkAge:function(age){
     34                     if(age>=0 && age<150){
     35                         return true
     36                     }else{
     37                         return false;
     38                     }
     39                 }
     40             };
     41             Person.prototype["getName"] = function(){
     42                 return this.name || "javascript.com"
     43             }
     44 //            var p = new Person(-10,"jim");
     45 //            alert(p.name+"  "+p.age);
     46             //读取规则的验证
     47             var p2 = new Person(27);
     48             alert(p2.getName()+"  "+p2.age);
     49             
     50         })()
     51         }
     52         
     53         //用命名规范来区别私有和公有变量
     54         function demo2(){
     55         (function(){
     56             function Person(name,age,email){
     57                 //定义私有变量
     58                 this._name;
     59                 this._age;
     60                 this.setName(name);
     61                 this.setAge(age);
     62                 this.emial = email;
     63                 
     64             }
     65             Person.prototype = {
     66                 setName:function(name){
     67                     this._name = name;
     68                 },
     69                 setAge:function(age){
     70                     
     71                     if(age>=0 && age<150){
     72                         this._age = age;
     73                     }else{
     74                         throw new Error("年龄必须在0-150之间")
     75                     }
     76                 }
     77             };
     78             
     79             var p = new Person("jim",1,"张丹");
     80             
     81         })();
     82         }
     83         
     84         //闭包实现封装
     85         function demo3(){
     86         (function(){
     87             function Person(name,age,email,sex){
     88                 this.email = email;
     89                 //get
     90                 this.getName = function(){
     91                     return this.name;
     92                 }
     93                 this.getAge = function(){
     94                     return this.age;
     95                 }
     96                 
     97                 //set
     98                 this.setName = function(name){
     99                     this.name = name;
    100                 }
    101                 this.setAge = function(age){
    102                     if(age>=0 && age<150){
    103                         this.age = age;
    104                     }else{
    105                         throw new Error("年龄必须在0-150之间")
    106                     }
    107                 };
    108                 
    109                 var _sex="M"; //这也是私有变量的编写方式
    110                 this.getSex = function(){
    111                     return _sex;
    112                 }
    113                 this.setSex = function(sex){
    114                     _sex = sex;
    115                 }
    116                 this.init = function(){
    117                     this.setName(name);
    118                     this.setAge(age);
    119                 }
    120                 this.init();
    121                 
    122             }
    123             var p = new Person("jim",-1,"xxxx@qq.com")
    124         })();
    125         }
    126         
    127         //静态化
    128         (function(){
    129             /*
    130              * 普通的属性和函数是作用在对象上的
    131              * 静态函数是定义到类上的
    132              */
    133             
    134             function Person(name,age){
    135                 this.name = name;
    136                 this.showName = function(){
    137                     alert(this.name);
    138                 }
    139             }
    140             //第一种静态函数的写法
    141             Person.add = function(x,y){
    142                 return x+y
    143             }
    144             //alert(Person.add(1,3))
    145             
    146             //第二种方式:用类中类的方式完成每一个对象全拥有相同的属性和函数
    147             var cat = (function(){
    148                 //私有静态属性
    149                 var AGE = 10;
    150                 //私有函数
    151                 function add(x,y){
    152                     return x+y
    153                 }
    154                 return function(){
    155                     this.AGE = AGE;
    156                     this.add = function(x,y){
    157                         return add(x,y);
    158                     }
    159                     this.setAge = function(age){
    160                         AGE = age;//这个可以设置成功,但只对以后创建实例的初始化有效。
    161                     }
    162                 }
    163             })()
    164             
    165             alert(new cat().add(1,2)+"  "+new cat().AGE);
    166             new cat().setAge(20); //这个可以设置成功,但只对以后创建实例的初始化有效。
    167             alert(new cat().AGE);
    168         })();
    169         
    170         /*
    171          * 1.保护内部数据的完整性是封装一大用处
    172          * 2.对象的重构变得很轻松,(可以动态化变更部分代码)
    173          * 3.弱化模块之间的耦合。
    174          * 弊端:私有的方法会变得很难进行单元测试,使用封装就意味着与复杂的代码打交道。
    175          * 最大的问题:封装在javascript是很难实现的。
    176          */
    177         </script>
    178     </body>
    179 </html>
  • 相关阅读:
    CCOrbitCamera卡牌翻转效果
    用CCRenderTexture和BlendFunc制作游戏教学时使用的黑色覆盖层
    cocos2d-x触摸分发器原理
    cocos2d-x动作原理
    c++之函数原型
    cocos2d-x调度器原理
    cocos2d-x之MoonWarriors用c++实现
    cocos2d-x回收池原理
    SQL*Net more data to client等待事件
    asynch descriptor resize等待事件
  • 原文地址:https://www.cnblogs.com/chengyunshen/p/7191754.html
Copyright © 2011-2022 走看看