Seven JS object-oriented methods to create objects

This article mainly explains to you in detail the creation of seven JS object-oriented objects. It is mainly shared with you in the form of code. I hope it can help you.

1. Factory Pattern
Considering that classes cannot be created in ECMAScript, developers invented a function to encapsulate the details of creating objects with a specific interface:

function createPerson(name,age,job){
    var o = new Object();  
      o.name = name;  
      o.age = age;
      o.job = job;  
      o.sayName = function(){  
            alert(this.name);
    }; 
    return o;
}
var person1 = createPerson("Joy",29,"Software Engineer");
var person2 = createPerson("Greg",27,"Doctor");

2. Constructor mode

function Person(name,age,job){  
  this.name = name;  
   this.age = age;  
     this.job = job; 
        this.sayName = function(){   
             alert(this.name);
    }
}
var person1 = new Person("Joy",29,"Software Engineer");
var person2 = new Person("Greg",27,"Doctor");
alert(person1.sayName === person2.sayName); //false.每个Person实例都会创建一个功能相同的Function实例

3. Prototype mode
Every created function has a prototype attribute. This attribute is a pointer pointing to an object, and the purpose of this object is to contain There can be properties and methods shared by specific types. The advantage of using a prototype object is that all object instances can share the properties and methods it contains

function Person(){}
    Person.prototype.name = "Joy";
    Person.prototype.age = 29;
    Person.prototype.job = "Software Engineer";
    Person.prototype..sayName = function(){ 
  alert(this.name)
};
  var person1 = new Person();

4. Use the constructor pattern and prototype pattern in combination

 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("Joy",29,"Software Engineer");
   var person2 = new Person("Greg",27,"Doctor");
   alert(person1.sayName === person2.sayName); //true

​
5. Dynamic Prototype Mode

 function Person(name,age,job){   
    this.name = name;    
    this.age = age;    
    this.job = job;    
    if(typeof this.sayName != 'function'){  
          console.log(this.name); //在下了person1、person2两个实例下只会输出Joy，不会输出Greg   
          Person.prototype.sayName = function(){ //这里只在sayName()方法不存在的情况下，才会将它添加到原型中。这段代码只会在初次调用构造函数是才会执行。            alert(this.name)
        }
    }
}
  var person1 = new Person("Joy",29,"Software Engineer");var person2 = new Person("Greg",27,"Doctor");

6. Parasite Mode

   function Person(name,age,job){   
    var o = new Object();    
    o.name = name;    
    o.age = age;    
    o.job = job;    
    o.sayName = function(){        
        alert(this.name);
    };
        return o;
}
var person1 = new Person("Joy",27,"Software Engineer");

Objects and structures returned by parasite mode There is no relationship between the function or the prototype properties of the constructor, that is, the object returned by the constructor is no different from the object created outside the constructor. For this reason, it is recommended not to use this mode when other modes can be used

7. Safe constructor mode
The so-called safe means that there are no public properties, and its methods do not reference this object. Safe constructors follow a similar pattern to parasitic constructors, but there are two differences: First, the newly created object instance method does not reference this; instead, the new operator is not used to call the constructor.

function Person(name,age,job){   
 var o = new Object();    
   o.sayName = function(){     
      alert(name)
    }; 
       return o;
}
var person1 = Person("Joy",29,"Software Engineer");

In this way, the variable person1 is a safe object, and there is no other way to access its data members except the sayName() method. Even if other code adds methods or data members to this object, there is no other way to access the original data passed into the constructor.

The above is the detailed content of Seven JS object-oriented methods to create objects. For more information, please follow other related articles on the PHP Chinese website!