javascript面向对象编程封装

来源:互联网 发布:软件行业发展现状 编辑:程序博客网 时间:2024/06/10 15:33

 

Javascript是一种基于对象(object-based)的语言,你遇到的所有东西几乎都是对象。但是,它又不是一种真正的面向对象编程(OOP)语言,因为它的语法中没有class类

 

1.生成对象的原始模式

     var Dog={

                     name:'',

                     color:''

                    };

   现在我们根据原型对象的schema 生成两个实例对象

   var dog1={};

         dog1.name='大黄';

         dog1.color='黄色';

   var dog2={};

         dog2.name='二黄';

         dog2.color='黑色';

  这就是最简单的封装了,把两个属性封装在一个对象里面。但这样的写法有两个缺点,一如果多生成几个实例,写起来就非常麻烦;二实例与原型之间,看不出有什么联系。

2. 原始模式的改进

   写一个函数,解决代码复用的问题

   function Dog(name,color)

   {

        return {

                  name:name,

                  color:color

                   }

   }

  生成对象实例就是在调用函数

  var dog1=Dog('大黄','黄色');

  var dog2=Dog('二黄','黑色');

  这种方法的问题是依然dog1与dog2没有内在的联系,不能反映出来他们是同一个原型对象的实例。

 3.构造函数模式

  为了解决从原型对象生成实例的问题,javascript 提供了一个构造函数(Contructor)模式

  所谓“构造函数”就是内部使用this,使用new生成实例

  现在对象可以写成这样

 function Dog(name,color)

 {

        this.name=name;

       this.color=color;

}

生成实例

 var dog1=new Dog('大黄','黄色');

 var dog2=new Dog('二黄','黑色');

此时实例dog1与dog2拥有一个constructor属性,指向他们的构造函数

alert(dog1.constructor==Dog);//true

alert(dog2.constructor==Dog);//true

javascript 还提供了一个关键字instanceof来验证圆形对象与实例之间的联系

alert(dog1 instanceof Dog);//true

alert(dog2 instanceof Dog);//true

4.构造函数模式的问题

构造函数好用但是存在一个耗费内存的问题,我们现在给Dog对象添加一个不变的属性type和一个方法“吃”

 function Dog(name,color)

 {

        this.name=name;

       this.color=color;

       this.type='动物';

       this.eat=function (){alert('吃');}

}

生成实例

var dog1=new Dog('大黄','黄色');

var dog2=new Dog('二黄','黑色');

alert(dog1.type);//动物

dog2.eat();//吃

这样写表面上没有任何问题,但是生成每一个实例时,都有type和eat都会生成一模一样的内容,每次生成都会增加一样的内存,效率不高

alert(dog1.eat==dog2.eat);//false

能不能让同样的type和eat在内存中生成一次,然后所有实例都指向那个内存地址,答案是可以的

5. Prototype模式

javascript 规定 每一个构造函数都有一个prototype属性,指向另一个对象,这个对象的所有属性和方法都会被构造函数的实例继承

这就意味着我们可以把那些不变的属性和方法定义在prototype上

function Dog(name,color)

{

      this.name=name;

      this.color=color;

}

Dog.prototype.type='动物';

Dog.prototype.eat=function(){alert('吃');}

生成实例

var dog1=new Dog('大黄','黄色');

var dog2=new Dog('二黄','黑色');

alert(dog1.type);//动物

dog1.eat();//吃

这个时候所有实例的type与eat()都是相同的内存地址,指向prototype对象

alert(dog1.eat==dog2.eat)//true

6. Prototype模式的验证方法

     1.isPrototypeOf() 判断某个prototype对象与实例之间的联系

      alert(Dog.prototype.isPrototypeOf(dog1));//true

     2.hasOwnProperty() 每个实例都有一个hasOwnProperty() 方法  用来判断一个属性是本地的还是继承与prototype对象

      alert(dog1.hasOwnProperty('name'));//false

      alert(dog1.hasOwnProperty('type'));//true

     3.in 可以用来判断某个实例是否含有某个属性,不管是不是本地属性

      alert('name' in dog1);//true

      alert('type' in dog1);//ture

      还可以遍历对象的属性

     for(var i in  dog1){ alert(dog1[i]);}

原创粉丝点击