构造函数的8种创建模式

阅读() @2018-10-29 18:16:05

以下8种构造函数创建模式,仅供参考。我个人习惯用第六种。

第一种:

/***传统的创建对象***/
var person = new Object();
person.name = “lancer”;
person.age = 24;
person.job = “UI”;
person.sayName = function(){
    alert(this.name);
}
person.sayName();

第二种:

/***工厂模式***/
function createPerson(name,age,job){
        var o = new Object();
       .name = name;
        o.age = age;
        o.job = job;
        o.sayName = function(){
               alert(o.name);
         }
         return o;
}
var person1 = createPerson(“lancer”,24,”UI”);
person1.sayName();

第三种:

/***构造函数***/
function Person(name,age,job){
      this.name = name;
      this.age = age;
      this.job =job;
      this.sayName = function(){
            alert(this.name)
       }
}
var person1 = createPerson(“lancer”,24,”UI”);
person1.sayName();

第四种:

/***原型模式***/
function Person(){

}
Person.prototype.name =”lancer”;
Person.prototype.age =24;
Person.prototype.job = “UI”;
Person.prototype.sayName = function(){
       alert(this.name)
}
var person1 = new Person();
person1.sayName();
var person2 = new Person();
person2.name =”lara”
person2.sayName();

第五种:

/***简单原型模式***/
function Person(){

}
Person.prototype = {
       name : “lancer”,
       age : 24,
       job : “UI”,
       sayName : function(){
            alert(this.name)
       }

};
var person1 = new Person();
person1.sayName();

我个人不建议使用第五种方法,因为构造函数对象本身的prototype中有很多自带的功能,比如constructor(用来验证某个对象属于哪个构造函数),如果直接用Person.prototype = {},这样会把原有的那些功能给覆盖掉。

例如:

var time = new Date();
console.log(time.constructor);    //   function Date() { [native code] }
var arry = new Array();
console.log(arry.constructor==Array);     //  true

第六种:这也是我习惯使用的一种方法

***构造函数和原型模式***/
function Person(name,age,job){
     this.name = name;     
     this.age = age;
     this.job =job;
}
Person.prototype.sayName = function(){
      alert(this.name)
};
var person1 = new Person("lancer","24","UI");
person1.sayName();

第七种:

/***动态原型模式***/
function Person(name,age,job){
      this.name = name;
      this.age = age;
      this.job =job;
}
if(typeof this.sayName !=”function”){
     Person.prototype = {
           constructor :Person,
           sayName : function(){
                   alert(this.name)
           }
     };
}
var person1 = new Person(“lancer”,”24″,”UI”);
person1.sayName();

第八种:

/***稳妥构造函数***/
var Person = function(name,age,job){
        var O = new Object();
        O.sayName = function(){
            alert(name);
        };
return O
}
var person1 = Person(“lancer”,24,”UI”);
person1.sayName();

可以根据自己的习惯任意选用一种写法!

微信二维码