Grundlagen der objektorientierten JavaScript-Programmierung_Grundkenntnisse

Objektorientiert neu verstehen
Um zu veranschaulichen, dass JavaScript eine vollständig objektorientierte Sprache ist, ist es zunächst notwendig, mit dem Konzept der Objektorientierung zu beginnen und mehrere Konzepte der Objektorientierung zu diskutieren:

1. Alles ist ein Objekt
2. Objekte verfügen über Kapselungs- und Vererbungsfunktionen
3. Objekte nutzen Nachrichten, um miteinander zu kommunizieren, und in jedem Objekt sind Informationen verborgen

Basierend auf diesen drei Punkten ist C eine halb objektorientierte und halb prozedurale Sprache, denn obwohl sie Klassenkapselung, Vererbung und Polymorphismus implementiert, gibt es globale Funktionen und Variablen, die keine Objekte sind. Java und C# sind vollständig objektorientierte Sprachen. Sie organisieren Funktionen und Variablen in Form von Klassen, sodass sie ohne Objekte nicht existieren können. Aber hier ist die Funktion selbst ein Prozess, der einfach einer bestimmten Klasse zugeordnet ist.

Objektorientiert ist jedoch nur ein Konzept oder eine Programmieridee und sollte für seine Existenz nicht von einer bestimmten Sprache abhängen. Java verwendet beispielsweise objektorientiertes Denken zum Aufbau seiner Sprache und implementiert Mechanismen wie Klassen, Vererbung, Ableitung, Polymorphismus und Schnittstellen. Diese Mechanismen sind jedoch nur ein Mittel zur Implementierung der objektorientierten Programmierung und nicht notwendig. Mit anderen Worten: Eine Sprache kann basierend auf ihren eigenen Merkmalen einen geeigneten Weg zur Implementierung der Objektorientierung wählen. Da die meisten Programmierer daher zuerst kompilierte Hochsprachen wie Java und C lernen oder verwenden (obwohl Java halbkompiliert und halbinterpretiert ist, wird es im Allgemeinen als kompilierte Sprache erklärt), akzeptieren sie vorgefasst den Begriff „Klasse“. ". Objektorientierte Implementierungsmethode. Beim Erlernen von Skriptsprachen ist es daher üblich, die Konzepte in klassenbasierten objektorientierten Sprachen zu verwenden, um zu beurteilen, ob die Sprache eine objektorientierte Sprache ist oder ob sie objektorientierte Merkmale aufweist . Dies ist auch einer der wichtigen Gründe, die Programmierer daran hindern, JavaScript gründlich zu erlernen und zu beherrschen.
Tatsächlich implementiert die JavaScript-Sprache die objektorientierte Programmierung durch eine Methode namens Prototyp. Lassen Sie uns die Unterschiede zwischen den beiden Methoden zum Aufbau der objektiven Welt diskutieren, der klassenbasierten objektorientierten und der prototypbasierten objektorientierten Methode.
Vergleich zwischen klassenbasierten objektorientierten und prototypbasierten objektorientierten Ansätzen
Beim klassenbasierten objektorientierten Ansatz werden Objekte basierend auf Klassen generiert. Beim prototypbasierten objektorientierten Ansatz werden Objekte mithilfe von Konstruktoren und Prototypen konstruiert. Geben Sie ein Beispiel aus der objektiven Welt, um den Unterschied zwischen den beiden Erkenntnisarten zu veranschaulichen. Wenn beispielsweise eine Fabrik ein Auto baut, müssen sich die Arbeiter einerseits auf eine Konstruktionszeichnung beziehen und der Entwurf legt fest, wie das Auto hergestellt werden soll. Die technischen Zeichnungen hier sind wie Klassen in der Sprache, und Autos werden gemäß dieser Klasse hergestellt. Andererseits verwenden Arbeiter und Maschinen (entspricht den Konstrukteuren) verschiedene Teile wie Motoren, Reifen, Das Lenkrad (entspricht jedem Attribut von). der Prototyp) baut das Auto.
Tatsächlich gibt es immer noch Debatten darüber, welche der beiden Methoden objektorientierte Ideen gründlicher zum Ausdruck bringt. Der Autor ist jedoch aus folgenden Gründen der Ansicht, dass der objektorientierte Prototyp ein gründlicherer objektorientierter Ansatz ist:
Erstens ist die Schaffung von Objekten in der objektiven Welt das Ergebnis der Konstruktion anderer physischer Objekte, und abstrakte „Zeichnungen“ können keine „Autos“ erzeugen. Mit anderen Worten, eine Klasse ist eher ein abstraktes Konzept als eine Entität die Schaffung von Objekten ist die Schaffung einer Entität
Zweitens ist gemäß der grundlegendsten objektorientierten Regel die Klasse selbst kein Objekt. Der Konstruktor und der Prototyp in der Prototyp-Methode sind jedoch selbst andere Objekte, die durch die Prototyp-Methode konstruiert werden.
Drittens wird in einer klassenbasierten objektorientierten Sprache der Status eines Objekts von der Objektinstanz gehalten, und die Verhaltensmethode des Objekts wird von der Klasse gehalten, die das Objekt deklariert, und nur die Struktur und Methoden können geerbt werden ; In prototypischen objektorientierten Sprachen gehören das Verhalten und der Status des Objekts zum Objekt selbst und können zusammen vererbt werden (Referenzressourcen), was der objektiven Realität näher kommt.
Schließlich ermöglichen klassenbasierte objektorientierte Sprachen wie Java die Deklaration statischer Eigenschaften und statischer Methoden in Klassen, um die Unannehmlichkeiten auszugleichen, die entstehen, wenn in prozeduralen Sprachen keine globalen Funktionen und Variablen verwendet werden können. Tatsächlich gibt es in der objektiven Welt kein sogenanntes statisches Konzept, denn alles ist ein Objekt! In einer prototypischen objektorientierten Sprache dürfen außer integrierten Objekten keine globalen Objekte, Methoden oder Eigenschaften existieren und es gibt kein statisches Konzept. Alle Sprachelemente (Primitive) müssen für ihre Existenz von Objekten abhängen. Aufgrund der Eigenschaften funktionaler Sprachen ändern sich jedoch die Objekte, von denen Sprachelemente abhängen, mit Änderungen im Laufzeitkontext, was sich insbesondere in Änderungen im this-Zeiger widerspiegelt. Es ist diese Eigenschaft, die der natürlichen Ansicht näher kommt, dass „alles zu etwas gehört und das Universum die Grundlage für das Überleben aller Dinge ist“.

JavaScript objektorientierte Grundkenntnisse

Obwohl JavaScript selbst nicht über das Konzept von Klassen verfügt, weist es dennoch objektorientierte Merkmale auf, obwohl es sich von gängigen objektorientierten Sprachen unterscheidet.

Der einfache Weg, ein Objekt zu erstellen, ist wie folgt:

function myObject() {

};

JavaScript 中创建对象的方法一般来说有两种：函数构造法和字面量法，上面这种属函数构造法。下面是一个字面量法的例子：

var myObject = {

};

Wenn Sie nur ein Objekt benötigen und keine weiteren Instanzen des Objekts benötigen, empfiehlt sich die Verwendung der Literalmethode. Wenn mehrere Instanzen eines Objekts erforderlich sind, wird der Funktionskonstruktor empfohlen.
Definieren Sie Eigenschaften und Methoden

Funktionskonstruktionsmethode:

function myObject() {
 this.iAm = 'an object';

 this.whatAmI = function() {
 console.log('I am ' + this.iAm);
 };
};

Wörtliche Methode:

var myObject = {
 iAm : 'an object',

 whatAmI : function() {
 console.log('I am ' + this.iAm);
 }
};

Die mit den beiden oben genannten Methoden erstellten Objekte haben eine Eigenschaft namens „iAm“ und eine Methode namens „whatAmI“. Eigenschaften sind Variablen in einem Objekt und Methoden sind Funktionen in einem Objekt.

So erhalten Sie Attribute und rufen Methoden auf:

var w = myObject.iAm;

myObject.whatAmI();

Wenn Sie eine Methode aufrufen, müssen Sie danach Klammern hinzufügen. Wenn Sie keine Klammern hinzufügen, wird lediglich ein Verweis auf die Methode zurückgegeben.
Der Unterschied zwischen den beiden Methoden zum Erstellen von Objekten

• Beim Definieren von Eigenschaften und Methoden im Funktionskonstruktor müssen Sie das Präfix this verwenden, das in der Literalmethode nicht erforderlich ist.
• Der Funktionskonstruktor verwendet =, wenn er Eigenschaften und Methoden Werte zuweist, und die Literalmethode verwendet : .
• Wenn es mehrere Eigenschaften oder Methoden gibt, sollten diese im Funktionskonstruktor durch ; und in der Literalmethode getrennt werden.

Für Objekte, die mit einer Literalmethode erstellt wurden, können Sie deren Eigenschaften oder Methoden direkt über die Referenz des Objekts aufrufen:

myObject.whatAmI();

Für den Funktionskonstruktor müssen Sie eine Instanz des Objekts erstellen, bevor Sie seine Eigenschaften oder Methoden aufrufen können:

var myNewObject = new myObject();
myNewObject.whatAmI();

Konstruktor verwenden

Jetzt kehren wir zur vorherigen Funktionskonstruktionsmethode zurück:

function myObject() {
 this.iAm = 'an object';
 this.whatAmI = function() {
 console.log('I am ' + this.iAm);
 };
};

Eigentlich sieht es wie eine Funktion aus. Kann ich ihr Parameter übergeben, da es sich um eine Funktion handelt? Ändern Sie den Code leicht:

function myObject(what) {
 this.iAm = what;
 this.whatAmI = function(language) {
 console.log('I am ' + this.iAm + ' of the ' + language + ' language');
 };
};

Instanziieren Sie dann das Objekt und übergeben Sie die Parameter:

var myNewObject = new myObject('an object');
myNewObject.whatAmI('JavaScript');

Die endgültige Ausgabe des Programms ist, dass ich ein Objekt der JavaScript-Sprache bin.
Es gibt zwei Möglichkeiten, Objekte zu erstellen. Welche soll ich verwenden?

Da bei literalen Methoden keine Instanziierung erforderlich ist, wird der Wert des Objekts dauerhaft geändert, und jeder andere Zugriff ist der geänderte Wert. Für den Funktionskonstruktor wird beim Ändern des Werts der Wert seiner Instanz geändert. Er kann N Objekte instanziieren, und jedes Objekt kann seinen eigenen unterschiedlichen Wert haben, ohne sich gegenseitig zu beeinträchtigen. Vergleichen Sie die folgenden Codeausschnitte.

Schauen wir uns zunächst die wörtliche Methode an:

var myObjectLiteral = {
 myProperty : 'this is a property'
};

console.log(myObjectLiteral.myProperty); // log 'this is a property'

myObjectLiteral.myProperty = 'this is a new property';

console.log(myObjectLiteral.myProperty); // log 'this is a new property'

Auch wenn eine neue Variable erstellt wird, die auf dieses Objekt zeigt, ist das Ergebnis immer noch dasselbe:

var myObjectLiteral = {
 myProperty : 'this is a property'
};

console.log(myObjectLiteral.myProperty); // log 'this is a property'

var sameObject = myObjectLiteral;

myObjectLiteral.myProperty = 'this is a new property';

console.log(sameObject.myProperty); // log 'this is a new property'

Sehen Sie sich noch einmal die Funktionskonstruktionsmethode an:

// 用函数构造法
var myObjectConstructor = function() {
   this.myProperty = 'this is a property'
};

// 实例化一个对象
var constructorOne = new myObjectConstructor();

// 实例化第二个对象
var constructorTwo = new myObjectConstructor();

// 输出
console.log(constructorOne.myProperty); // log 'this is a property'

// 输出
console.log(constructorTwo.myProperty); // log 'this is a property'

和预期一样，两个对象的属性值是一样的。如果修个其中一个对象的值呢？

// 用函数构造法
var myObjectConstructor = function() {
 this.myProperty = 'this is a property';
};

// 实例化一个对象
var constructorOne = new myObjectConstructor();

// 修改对象的属性
constructorOne.myProperty = 'this is a new property';

// 实例化第二个对象
var constructorTwo = new myObjectConstructor();

// 输出
alert(constructorOne.myProperty); // log 'this is a new property'

// 输出
alert(constructorTwo.myProperty); // log 'this is a property'

Wie Sie sehen, sind verschiedene mit dem Funktionskonstruktor instanziierte Objekte unabhängig voneinander und können jeweils unterschiedliche Werte haben. Welche Methode zum Erstellen von Objekten verwendet wird, hängt daher von der tatsächlichen Situation ab.