Heim  >  Artikel  >  Web-Frontend  >  So erstellen Sie Objekte

So erstellen Sie Objekte

高洛峰
高洛峰Original
2016-10-29 13:44:551148Durchsuche

1. Verwenden Sie Object, um Objekte zu erstellen

var person = new Object();
person.name = "Nicholas";
person.age = "29";
person.job = "Software Engineer";

person.sayName = function(){
    alert(this.name);
};

//对象字面量写法
var person = {
    name: "Nicholas",
    age: "29",
    job: "Software Engineer",
    
    sayName: function(){
        alert(this.name);
    }
};

Nachteile: Die Verwendung derselben Schnittstelle zum Erstellen vieler Objektpaare führt zu einer Menge doppeltem Code.

2. Fabrikmuster

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("Nicholas", "29", "Software Engineer");
var person2 = createPerson("Greg", "27", "Doctor");

Nachteile: Der Objekttyp kann nicht identifiziert werden.

3. Konstruktormuster

function Person(name, age, job) {
    this.name = name;
    this.age = age;
    this.job = job;
    this.sayName = function(){
        alert(this.name);
    };
}
//构造函数使用new操作符来调用
var person1 = new Person("Nicholas", "29", "Software Engineer");
var person2 = new Person("Greg", "27", "Doctor");

Nachteile: Jede Methode muss auf der Instanz neu erstellt werden

//不同实例上的同名函数是不相等的
alert(person1.sayName == person2.sayName);        //false

//可以把函数定义转移到构造函数外来解决这个问题
function Person(name, age, job) {
    this.name = name;
    this.age = age;
    this.job = job;    
   this.sayName = sayName;
}
function sayName() {
    alert(this.name);
}

4. Prototypmuster

Jede Funktion Wir erstellen ein Prototypattribut, das einen Zeiger auf ein Objekt darstellt. Der Zweck dieses Objekts besteht darin, Eigenschaften und Methoden zu enthalten, die von allen Instanzen eines bestimmten Typs gemeinsam genutzt werden können.

function Person() {
}
Person.prototype.name = "Nicholas";
Person.prototype.age = "29";
Person.prototype.job = "Software Engineer";
Person.prptptype.sayName = function(){
    alert(this.name);
};

var person1 = new Person();
person1.sayName();        //"Nicholas"

var person2 = new Person();
person2.sayName();        //"Nicholas"

alert(person1.sayName == person2.sayName);        //true
//更简单的原型语法
function Person() {
}
Person.prototype = {
    constructor : Person,        //以对象字面量形式创建新对象,constructor不再指向Person,在此特意设置为Person
    name : "Nicholas",
    age : "29",
    job : "Software Engineer",
    sayName : function () {
        alert(this.name);
    }
};

Prototyp und Instanz sind durch die Prototyp- und Konstruktorattribute miteinander verbunden.

Wenn der Code die Attribute eines Objekts liest, ruft er zuerst die Instanz ab und dann Ruft den Prototyp der Instanz ab, sodass Instanzeigenschaften Vorrang vor Prototypeigenschaften haben.

Durch das Reprototypisieren des Objekts wird die Verbindung zwischen dem Prototyp und der Instanz getrennt, durch das Ändern des Prototypobjekts jedoch nicht.

Nachteile: Instanzen können keine eigenen Eigenschaften haben

5. Verwenden Sie das Konstruktormuster und das Prototypmodell in Kombination

//构造函数模式用于定义实例属性
function Person(name, age, job) {
    this.name = name;
    this.age = age;
    this.job = job;
    this.friend = ["Shelby", "Court"];
}

//原型模式用于定义方法和共享属性
Person.prototype = {
    constructor : Person;
    sayName : function() {
        alert(this.name);
    }
}

6. Robustes Konstruktormuster


Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel:Javascript-ObjektNächster Artikel:Javascript-Objekt