如何构造对象

a) 工厂模式;  b) 构造函数模式;  c) 原型模式;

1.1构造函数模式 

1.1.1使用new操作符后跟Object构造函数 如:

   var  person = new Object();

   person.name = "kitty";

   person.age = 25;

 

person.__proto__(隐式原型)指向Object.prototype; 

1.1.2 由构造函数构造出来的

  function Car(sColor,iDoors,iMpg) {

    this.color = sColor;

    this.doors = iDoors;

    this.mpg = iMpg;

    this.showColor = function() {

      alert(this.color);

     };

  }

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

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

 

  person.__proto__指向Car.prototype;

    1.1.3这个对象是由函数Object.create构造的。

  var person1 = {

      name: 'cyl',

      sex: 'male'

  };

  var person2 = Object.create(person1);

本例中,对象person2的[[prototype]]指向对象person1。在没有Object.create函数的日子里,人们是这样做的:

  Object.create = function(p) {

      function f(){}

        f.prototype = p;

        return new f();

   }

1.2使用“对象字面量”表示法,如:

  var person = {

        name : "kitty",

        age:25

   };

JavaScript还支持对象和数组字面量,允许使用一种简洁而可读的记法来创建数组和对象。

前面的例子展示了对象和数组字面量中可以包含其他字面量。以下是一个更复杂的示例:

   var team = {

    name: "",

    mebers: [],

    count: function () { return mebers.length; }

  };

赋给team变量的对象有3个属性:name、members和count。注意,''表示空串,[]是一个空数组。甚至count属性的值也是一个字面量,即函数字面量(function literal):

1.3工厂模式 方法:

  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("red",4,23);

  var oCar2 = createCar("blue",3,25);

  oCar1.showColor();      //输出 "red"

  oCar2.showColor();      //输出 "blue"

前面的例子中,每次调用函数 createCar(),都要创建新函数 showColor(),意味着每个对象都有自己的 showColor() 版本。而事实上,每个对象都共享同一个函数。javascript中没有什么static和成员变量之分,如果想在对象之间共享数据或方法,只能借助原型对象,将共享的变量和方法都放在原型对象中。

1.4原型方式

  function Car() {}

  Car.prototype.color = "blue";

  Car.prototype.doors = 4;

  Car.prototype.mpg = 25;

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

  Car.prototype.showColor = function() {

    alert(this.color);

  };

 

  var oCar1 = new Car();

  var oCar2 = new Car();

  oCar1.drivers.push("Bill");

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

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

1.5、混合的构造函数/原型方式(相对完美的解决方式)

联合使用构造函数和原型方式,就可像用其他程序设计语言一样创建对象。这种概念非常简单,即用构造函数定义对象的所有非函数属性,用原型方式定义对象的函数属性(方法)。结果是,所有函数都只创建一次,而每个对象都具有自己的对象属性实例。

  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"

JS的构造函数都有一个prototype属性,指向它的原型对象(其实就是个普通的JS对象)。通过同一个构造函数创建出来的对象,共享同一个原型对象。原型对象初始化的时候是空的,我们可以在里面自定义任何属性和方法,这些方法和属性都将被该构造函数所创建的对象继承。如果原型发生了变化,那么所有实例都会跟着改变。

 

posted @ 2017-06-27 22:43  夏目桑  阅读(451)  评论(0编辑  收藏  举报