Objektorientierte JavaScript-Programmierung (Objekterstellung)

Vorwort

Bevor Sie objektorientierte (objektorientierte,oo) Programmierung lernen, müssen Sie zunächst wissen, was ein Objekt ist, ECMA -262, definieren Sie ein Objekt als eine Sammlung von "ungeordneten Attributen, deren Attribute Grundwerte, Objekte oder Funktionen enthalten können ". Es gibt viele Möglichkeiten, Objekte in JavaScript zu erstellen, wie zum Beispiel: Fabrikmuster, Konstruktormuster, Prototypmuster, kombiniertes Konstruktormuster und Prototypmuster, parasitäres Konstruktormuster usw.

1. Fabrikmuster

Das Fabrikmuster ist ein bekanntes Entwurfsmuster im Bereich der Softwareentwicklung. Dieses Muster abstrahiert den Prozess der Erstellung spezifischer Objekte. Da in ECMAScript keine Klassen erstellt werden können, haben Entwickler eine Funktion erfunden, die die Details der Objekterstellung mit einer bestimmten Schnittstelle kapselt.

function createStudent(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 student1= createStudent("xiaoming", 9, "student");
var student2 = createStudent("xiaowagn", 15, "student");

Die Funktion createStudent() kann ein Student-Objekt erstellen, das alle notwendigen Informationen basierend auf den akzeptierten Parametern enthält. Diese Funktion kann unbegrenzt oft aufgerufen werden und gibt jedes Mal ein Objekt zurück, das drei Eigenschaften und eine Methode enthält. Obwohl das Factory-Muster das Problem der Erstellung mehrerer ähnlicher Objekte löst, löst es nicht das Problem der Objektidentifizierung (d. h. wie man den Typ eines Objekts erkennt). Mit der Entwicklung von JavaScript ist ein weiteres neues Muster entstanden.

2. Konstruktormuster

Zuerst ändern wir den vorherigen Code wie folgt:

function Student(name,age){
      this.name=name;
      this.age=age;
      this.showname=function(){
      alert(this.name);
      }
}
var xiaoming =new Student("xiaoming",6);
var xiaogang =new Student("xiaogang",7);

Unterschied zum Fabrikmuster:

1. Das erstellte Objekt wird nicht angezeigt

2. weist die Eigenschaften diesemObjekt direkt zu

3. Es gibt keine Rückgabe-Erklärung.

Um eine Instanz zu erstellen, verwenden Sie den Operator new.

Schritte zum Erstellen eines Objekts:

1.Erstellen Sie ein neues Objekt

2.Weisen Sie den Bereich des Konstruktors zu Geben Sie ein neues Objekt an (dies zeigt auf dieses neue Objekt)

3.Führen Sie den Code des Konstruktors aus und fügen Sie Attribute zu diesem Objekt hinzu

4.Dieses Objekt zurückgeben

 
alert(xiaoming.constructor==Student) //true;

Das Attribut Konstruktor des Objekts wurde ursprünglich zur Identifizierung eines Objekts verwendet Objekttyp. Durch die Überprüfung eines Objekttyps oder die Verwendung von Instanzen wird festgestellt, dass sie einem bestimmten Typ angehören. Hier übertrifft das Konstruktormuster das Factory-Muster. Die Verwendung von Konstruktoren hat auch Nachteile. Das heißt, jede Methode muss in jeder Instanz neu erstellt werden. Zum Beispiel haben , xiaoming

alert(xiaoming instanceof Student) //true
alert(xiaoming instanceof Object) //true是因为所有对象均继承自Object

und

xiaogang

alle eine

showname()-Methode . Aber diese beiden Methoden sind keine Instanzen derselben Funktion. Die Funktionen in ECMAScript sind Objekte. Daher wird jedes Mal, wenn eine Funktion definiert wird, ein Objekt instanziiert. Aus logischer Sicht kann der Konstruktor zu diesem Zeitpunkt auch so definiert werden. Wie Sie sehen können, enthält jede Student-Instanz eine andere Funktionsinstanz. Funktionen mit demselben Namen auf verschiedenen Instanzen sind nicht gleich. Der folgende Code demonstriert dies. 2. Konstruktormuster

function student(name,age){
this.name=name;
this.showName=new Function(“alert(this.name)”);
}

Jede Funktion, die wir erstellen, verfügt über ein Prototypattribut, das ein Zeiger ist, der auf ein Objekt zeigt, und der Zweck dieses Objekts. Enthält Eigenschaften und Methoden, die sein können von allen Instanzen eines bestimmten Typs gemeinsam genutzt. Im wörtlichen Sinne ist Prototyp das Prototypobjekt der Objektinstanz, die durch den Aufruf des Konstruktors erstellt wird. Der Vorteil der Verwendung eines Prototypobjekts besteht darin, dass alle Objektinstanzen die darin enthaltenen Eigenschaften und Methoden gemeinsam nutzen können. Mit anderen Worten: Anstatt Informationen zu einer Objektinstanz im Konstruktor zu definieren, können Sie diese Informationen direkt zum Prototypobjekt hinzufügen.

function Student(){
 
}
Student.property.name=”default name”;
Student.property.age=0;
Student.property.showName=funciton(){
alert(this.name);
}
Var xiaoming=new Student();
Var xiaogang=new Student();

与构造函数模式的不同时，新对象的这些属性和方法是由所有的实例共享的。换句话说xiaoming和xiaogang访问的都是同一组属性和同一个showName()函数。要理解原型模式的工作原理，必须先理解ECMAScript 中原型对象的性质。

1. 理解原型对象

无论什么时候，只要创建了一个新函数，就会根据一组特定的规则为该函数创建一个prototype

属性，这个属性指向函数的原型对象。在默认情况下，所有原型对象都会自动获得一个constructor

（构造函数）属性，这个属性包含一个指向prototype 属性所在函数的指针。就拿前面的例子来说，

Student.prototype. constructor 指向Student。而通过这个构造函数，我们还可继续为原型对象添加其他属性和方法.

在JS中我们通过isPropertyOf()来判断，某个实例是否指向某个函数的的原型。

Eg：

Student.property.isPropertyOf(xiaoming);//true。

在ECMAScript5中含增加了Object.getPropertyOf()方法来获取一个实例的原型

Eg：

alert(Object.getPropertyOf(xiaoming)==Student.property);//true
alert(Object.getPropertyOf(xiaoming).name);//default name

此外，我们还可以通过hasOwnProperty()方法来检测一个属性是存在实例中还是存在原型中。alert(xiaoming.hasOwnProperty(“name”));//false

alert(xiaoming.property.hasOwnProperty(“name”));//true

原型模式也不是没有缺点。首先，它省略了为构造函数传递初始化参数这一环节，结果所有实例在默认情况下都将取得相同的属性值。虽然这会在某种程度上带来一些不方便，但还不是原型的最大问题。原型模式的最大问题是由其共享的本性所导致的。原型中所有属性是被很多实例共享的，这种共享对于函数非常合适。对于那些包含基本值的属性倒

也说得过去，毕竟（如前面的例子所示），通过在实例上添加一个同名属性，可以隐藏原型中的对应属性。然而，对于包含引用类型值的属性来说，问题就比较突出.

四、组合使用构造函数模式和原型模式

创建自定义类型的最常见方式，就是组合使用构造函数模式与原型模式。构造函数模式用于定义实例属性，而原型模式用于定义方法和共享的属性。结果，每个实例都会有自己的一份实例属性的副本，但同时又共享着对方法的引用，最大限度地节省了内存。另外，这种混成模式还支持向构造函数传递参数；可谓是集两种模式之长。

function Student(name,age){
this.name=name;
this.age=age;
}
Student.property.showName=funciton(){alert(this.name);}

这种构造函数与原型混成的模式，是目前在ECMAScript 中使用最广泛、认同度最高的一种创建自定义类型的方法。可以说，这是用来定义引用类型的一种默认模式。

五、寄生构造函数模式

通常，在前述的几种模式都不适用的情况下，可以使用寄生（parasitic）构造函数模式。这种模式的基本思想是创建一个函数，该函数的作用仅仅是封装创建对象的代码，然后再返回新创建的对象；但从表面上看，这个函数又很像是典型的构造函数。

funciton Student(name,age){
Var o=new Object();
o.name=name;
o.age=age;
o.showName=function(){alert(this.name);}
Reurn o;
}

关于寄生构造函数模式，有一点需要说明：首先，返回的对象与构造函数或者与构造函数的原型属性之间没有关系；也就是说，构造函数返回的对象与在构造函数外部创建的对象没有什么不同。为此，不能依赖instanceof 操作符来确定对象类型。由于存在上述问题，我们建议在可以使用其他模式的情况下，不要使用这种模式。个人感觉这模式还是有点模仿工厂模式。

 以上就是JavaScript面向对象编程(对象创建)的内容，更多相关内容请关注PHP中文网（www.php.cn）！