javascript中的创建自定义对象的六种方式详解

javascript中的创建自定义对象的六种方式详解

自定义对象：在javascript中自己定义的对象

第一种方式：工厂方式  

         function createCar(sColor,iDoors,iMpg) {

             var oTempCar = new Object;

             oTempCar.color = sColor;

             oTempCar.doors = iDoors;

             oTempCar.mpg = iMpg;

             oTempCar.showColor = function() {   //内部方法

             alert(this.color);

            };

        return oTempCar;

     }

     var oCar1 = createCar()；

     var oCar2 = createCar()；

第二种方式：构造函数方式

      第一步：定义对象的构造函数和方法

               function  member(name，gender) //构造函数

           {           

                 //在执行第一行代码前，js引擎会为我们生成一个对象。

                 this.name=name；

                 this.gender=gender；

                 this.display=display;  //我们采用外部引用，也可以采用内部方法

                 //此处有一个隐藏的return语句，用于将之前生成的对象返回。

           }

           function  display()  //方法

           {

                 document.writeln(this.name +”:” +this.gender+”<br>”)；

           }

     第二步：产生对象的实例

         var obj=new member(“刘安心”,”男”)；// new会创建和返回对象。

          obj.display();

     注意：可以给对象实例添加属性以改变该实例，但是用相同的构造器生成的其他实例并不包括这些属性，如：

                    obj.email=”asdfsa@126.com”;//只有obj这个实例有email属性

     将属性‘age’加到member原型对象中，这样member对象的所有实例都可以有该属性，包括那些已经生成的实例。

                         member.prototype.age=“20”;

         注意：使用工厂方式和构造函数方式时，如果方法定义在工厂或者构造函数的内部的话，创建多个对象时会重复生成函数。我们可以将工厂或者构造函数里的方法定义为外部引用。但是从语义上讲，函数又不太像是对象的方法。

第三种方式：原型方式

            function Car() {

            }

            Car.prototype.color = "blue";

            Car.prototype.doors = 4;

            Car.prototype.mpg = 25;

            Car.prototype.showColor = function() {

                      document.write(this.color);

           };

           var oCar1 = new Car();

           var oCar2 = new Car();

        这意味着必须在对象创建后才能改变属性的默认值，而且所有对象共享原型中的属性和方法，一个对象的属性和方法发生改变会反应在其他对象中。

第四种方式：混合的构造函数/原型方式

         即用构造函数定义对象的所有非函数属性，用原型方式定义对象的函数属性（方法）。

         function Car(sColor,iDoors,iMpg) {

               this.color = sColor;

               this.doors = iDoors;

               this.mpg = iMpg;

               this.drivers = new Array("Mike","John");

        }

        Car.prototype.showColor = function() {

                alert(this.color);

        };

        var oCar1 = new Car("red",4,23);

        var oCar2 = new Car("blue",3,25);

        oCar1.drivers.push("Bill");

        alert(oCar1.drivers);   //输出 "Mike,John,Bill"

        alert(oCar2.drivers);   //输出 "Mike,John"

         这意味着只创建 showColor() 函数的一个实例，所以没有内存浪费，而且每个对象都有各自的属性。但是大多数编程者认为这种方式并没有很好的解决面向对象的封装性问题。所以产生了动态原型法。

第五种：动态原型法

         function Car(sColor,iDoors,iMpg) {

               this.color = sColor;

               this.doors = iDoors;

               this.mpg = iMpg;

               this.drivers = new Array("Mike","John"); 

               if (typeof Car._initialized == "undefined") {

                        Car.prototype.showColor = function() {

                              alert(this.color);

                         };

                         Car._initialized = true;

               }

       }

       var oCar1 = new Car("red",4,23);

       var oCar2 = new Car("blue",3,25);

       oCar1.drivers.push("Bill");

       document.writeln(oCar1.drivers);

      document.writeln(oCar2.drivers);

        注意：与混合的构造函数/原型方式唯一的区别是赋予对象方法的位置。该方法使用标志(_initialized)来判断是否已给原型赋予了任何方法。

第六种：键值对方式

       var obj={username：“liuanxin”，password：“123”}

以上红色标记的是在javascript中创建自定义对象最常见的方法。