01_对象的创建方法

在平时的JS编码中,我们经常要创建一个对象,创建一个对象的方法有很多种,每一种方法都有自己的优缺点,这里全面剖析一下创建对象常用的6种方法,以及罗列他们的优缺点以供选择。

1.Object构造函数的方法;

2.对象字面量的方法;

3.工厂函数的模式;

4.自定义构造函数的方法;

5.使用原型的方法;

6.自定义构造函数和原型组合的方法;

 

01_Object构造函数的方法创造一个函数:(先创建一个空的对象,在手动添加属性和方法);

  var person = {} ;
 
//或者:var person = new Object();
  person.name = 'Tom';   person.setName = function(name){this.name = name};   alert(person.name);   // 输出 Tom   person.setName('Jack');   alert(person.name);  //输出 Jack

     缺点:代码数量过多;

    适用于:对象的属性起始不确定;

02_使用对象字面量的方法创造函数:(创造对象的同时指定属性和方法);

 var person = {
    name: 'Tom',
    setName: function(name){this.name = name;}
  }
  alert(person.name);  //输出Tom
  person.setName('Jack');
  alert(person.name);  //输出Jack

 

     缺点:创建多个同类对象时有重复代码;

    适用:提前知道属性值的对象;

03_工厂函数的模式创建一个人的对象;(把创造一个人的对象封装到一个工厂函数中,直接调用就可以产生大量的人);

 function createPerson(name){
    var person = {
      name: name,
      setName: function(name){this.name = name;}
    }
    return person;
  }
  var person1 = createPerson('Tom');
  alert(person1.name);  //输出Tom
  person1.setName('Jack');  
  alert(person1.name);  //输出Jack
  var person2 = creatPerson('Lucy');  //调用工厂函数创造第二个人的对象,仅调用即可;

 

     缺点:对象没有具体的类型,就是Object,可以与下面的方法对比;

    优点:解决了字面量方法的问题,可以大量生产对象;

4_使用自定义构造函数的方法创造一个人的对象;

 

    function Person(name){
        this.name = name ;
        this.setName = function(){
            this.name = name;
        }
    }
    var person = new Person('Tom');
    alert(person.name);    //输出Tom
    person.setName('Jack');
    alert(person.name);    //输出Jack

 

    缺点:数据没有复用,会占用更多的空间;

    优点:相对于工厂函数方法,创造的对象都有各自共同的对象名:Person;

5_使用原型的方法创造一个人的对象;

 

function Person(){}
Person.prototype.name = '';
Person.prototype.setName = function(name){
this.name = name;};
var person = new Person();  //创建对象时不能直接指定属性;
person.name = 'Tom';
alert(person.name); //输出Tom
person.setName('Jack');
alert(person.name);  //输出Jack

 

    缺点:创建对象时不能直接指定属性,需要重新添加,非常麻烦;

     优点:解决了使用自定义构造函数的方法存在的数据不能复用的问题;

 

 

 6_使用自定义构造函数和原型组合的方法创造对象,可以结合4、5方法的优点,推荐在一些较复杂的对象中使用;

 

function Person(name){
this.name = name
}
Person.prototype.setName = function(name){
this.name=name;
}
var person = new Person('Tom'); //输出Tom
alert(person.name);
alert(person.setName('Jack')); //输出Jack

 

    优点:结合了4、5的优点,即能复用数据,又能在创建函数的时候添加属性,同类对象的公共方法保存在父对象的原型中,方便调用;在实际中最常使用。

 

posted @ 2017-03-28 18:23  大虫吐泡泡  阅读(237)  评论(0编辑  收藏  举报