Share several ways to create objects in JS

This article mainly shares with you several ways to create objects in JS, hoping to help you.

1. Use native constructors to create objects of specific types

  var person =new Object();
    person.name="wangwu";
    person.age="20";
    person.sayName=function(){
    alert(this.name);
}

2. Use object literals

var person = {
    name:"wangwu",
    age:"20",
    sayName: function(){
        alert(this.name);
    }
}

Summary : Both methods can be used to create a single object, but they have obvious disadvantages. Using the same interface to create many objects will produce a lot of duplicate code.

3. Use the factory pattern

function createPerson(name,age){
    var o=new Object();
    o.name=name;
    o.age=age;
    o.sayName=function(){
            alert(this.name);
    };
    return o;
}
var person1=createPerson("wangwu",20);

Abstracts the process of creating specific objects, invents a function, and uses the function to encapsulate the creation of objects with a specific interface detail.

4. Constructor pattern

function  Person(name,age){
    this.name=name;
    this.age=age;
    this.sayName=function(){
        alert(this.name);
    };
}
var person1=new Person("wangwu",20);

Create a custom constructor to define the properties and methods of the custom object type.

5. Prototype pattern

function Person(){
}
Person.prototype.name="wangwu";
Person.prototype.age=20;
Person.prototype.sayName=function(){
    alert(this.name);
}
var person1=new Person();
person1.sayName(); //wangwu

Every function we create has a prototype (prototype) attribute, which is a pointer pointing to an object, and this The purpose of an object is to contain properties and methods that can be shared by all instances of a specific type. The disadvantage of the prototype pattern is that it omits the step of passing initialization parameters to the constructor. As a result, all instances obtain the same attribute values ​​by default; all attributes in the prototype are shared by many instances. For attributes containing reference type values, The problem is more prominent.

6. Combined use of constructor pattern and prototype pattern

function Person(name,age){
    this.name=name;
    this.age=age;
    this.friends=["wangwu","zhangsan"];
}
Person.prototype={
    constructor:Person,
    sayName:function(){
        alert(this.name);
    }
}
var person1=new Person("wangwu",20);
var person2=new Person("zhangsan",23);
person1.friends.push("lisi");
alert(person1.friends); //"wangwu,zhangsan,lisi"
alert(person2.friends); //"wangwu,zhangsan"

7. Dynamic prototype pattern

  function Person(name,age,job){
        //属性
    this.name=name;
    this.age=age;
    this.job=job;
//方法
if(typeof this.sayName!="function"){
    person.prototype.sayName=function(){
            alert(this.name);
    };
}
}
var  friend=new Person("wangwu",20);
friends.sayName();

8. Parasitic constructor pattern

function Person(name,age){
    var 0=new Object();
    o.name="wangwu";
    o.age=20;
    o.sayName=function(){
        alert(this.name);
    };
    return o;
}
var friend=new Person("wangwu",20);
friend.sayName(); //"wangwu"

9. Safe constructor pattern

function Person(name,age,job){
    //创建要返回的对象
    var  o=new Object();
    //可以在这里定义私有变量和函数
    //添加方法
    o.sayName=function(){
        alert(name);
    };
//返回对象
return o;
}
var friend=Person("wangwu",20);
friend.sayName();  //"wangwu"

Related recommendations:

JS Create Object Summary of methods (sample code)

Several ways to create objects in JS

Summary of several common ways to create objects in JS (recommended) _js object-oriented

The above is the detailed content of Share several ways to create objects in JS. For more information, please follow other related articles on the PHP Chinese website!