Javascript-Objektorientierte Kapselung und Vererbung_Javascript-Kenntnisse

Lassen Sie uns die Kapselung und Vererbung in js objektorientiert klären.

1. Kapselung
Es gibt viele Möglichkeiten, die Kapselung in js zu implementieren. Hier sind einige häufig verwendete.

1.1 Originalmodus-Generierungsobjekt
Schreiben Sie unsere Mitglieder direkt in das Objekt und geben Sie sie mit der Funktion zurück. Nachteile: Es ist schwierig, eine Instanz eines Musters zu erkennen.

Code:

Code kopieren Der Code lautet wie folgt:

Funktion Stu(Name, Punktzahl) {
             zurück {
Name: Name,
Punktzahl: Punktzahl
            }
}
        var stu1 = Stu("张三", 80);
        var stu2 = Stu("李思", 90);
console.log(stu1.name); // Zhang San

1.2 Konstruktionsmusterobjekte generieren

JS bietet uns ein Muster für die Verwendung von Konstruktoren zum Generieren von Objekten. Der sogenannte „Konstruktor“ ist eigentlich eine gewöhnliche Funktion, aber diese Variable wird intern verwendet. Wenn das Schlüsselwort new zum Generieren einer Instanz des Konstruktors verwendet wird, wird die Variable this an das Instanzobjekt gebunden.

Geben Sie den Code direkt ein:

Code kopieren Der Code lautet wie folgt:

Funktion Stu(Name, Punktzahl) {
This.name = Name,
This.score = Punktzahl
}
        var stu1 = new Stu("张三", 80);
        var stu2 = new Stu("李思", 90);
console.log(stu1.name "/" stu2.score); // Zhang San 90
console.log((stu1.constructor == Stu) "/" (stu2.constructor == Stu)); // true true
console.log((stu1 Instanz von Stu) "/" (stu2 Instanz von Stu)); // true true

Es ist nicht schwer zu erkennen, dass das vom js-Konstruktor generierte Objekt genau das gleiche ist wie das von der Klasse in C# generierte Objekt. Beide verwenden Vorlagen, um Objektmitglieder zu definieren und sie über das neue Schlüsselwort zu instanziieren.

Generieren Sie dasselbe Stu-Objekt mit C#-Code

Code kopieren Der Code lautet wie folgt:

Klasse Stu
{
​öffentlicher String-Name;
öffentliche Doppelpartitur;​​​​​​
}

OK, jetzt haben wir die Grundobjekte. Jetzt brauchen wir also eine Methode, die allen Objekten gemeinsam ist und die es nur erlaubt, diese Methode einmal zu erstellen. (Nicht wiederholt mit Objekt neu erstellt) Was soll ich tun? Jeder weiß, dass wir in C# statische Member verwenden können. Wie macht man das also in js?

1.3 Prototypmodus

In js hat jeder Konstruktor ein Prototypattribut. Alle Eigenschaften und Methoden dieses Objekts werden von der Instanz des Konstruktors geerbt. Das direkte Hinzufügen von Mitgliedern zum Prototyp entspricht dann der Deklaration statischer Mitglieder in C#.

Code:

Code kopieren Der Code lautet wie folgt:

Funktion Stu(Name, Punktzahl) {
This.name = Name,
This.score = Punktzahl
}
Stu.prototype.type='Student';
Stu.prototype.log = Funktion(en) {
console.log(s);
}
        var stu1 = new Stu("张三", 80);
        var stu2 = new Stu("李思", 90);
console.log(stu1.type "/" stu2.type); // Student Student
          stu1.log('hello'); // hallo
console.log(stu1.log == stu2.log); // true

Das war's mit der Kapselung. Schauen wir uns an, wie die Vererbung in js implementiert wird.

2. Vererbung

2.1 Konstruktorbindung

Rufen Sie direkt die Methode „call“ oder „apply“ in der untergeordneten Funktion auf, um den Konstruktor des übergeordneten Objekts an das untergeordnete Objekt zu binden.

Code kopieren Der Code lautet wie folgt:

Funktion Stu(Name, Punktzahl) {
Grade.apply(this, arguments);
//Grade.call(this, arguments);
This.name = Name,
This.score = Punktzahl
}
Funktion Grade() {
This.code = "Junior High School";
This.ask = function () {
console.log("Hallo zusammen");
            }
}
        var stu1 = new Stu("张三", 80);
        var stu2 = new Stu("李思", 90);
console.log(stu1.code); // Junior High School
          stu1.ask(); // Hallo zusammen

Die Anwendung hier führt zwei Dinge aus: Sie übergibt den ersten Parameter this an den Grade-Konstruktor (Aufrufer) und führt dann den Code in Grade aus. Dies entspricht der erneuten Ausführung der damit in Grade definierten Elemente in Stu.

2.2 Vererbung durch Prototyp
​Sehen Sie sich zuerst den Code an

Code:

Code kopieren Der Code lautet wie folgt:

Funktion Stu(Name, Punktzahl) {
This.name = Name,
This.score = Punktzahl
}
Funktion Grade() {
This.code = "Junior High School";
}
Stu.prototype = new Grade();
Stu.prototype.constructor = Stu; //Vererbungskettenstörung verhindern und die Anweisung manuell zurücksetzen
        var stu1 = new Stu("张三", 80);
        var stu2 = new Stu("李思", 90);
console.log(Stu.prototype.constructor); // Eigener Konstruktor
console.log(stu1.code); // Junior High School

Wie bereits erwähnt, entspricht der Prototyp einem statischen Mitglied in C#, daher wandeln wir alle Mitglieder der übergeordneten Klasse in unsere eigenen statischen Mitglieder um, um eine Vererbung zu erreichen.

Die Vererbung durch Prototypen hat einen Nachteil: Alle geerbten Mitglieder sind statisch. Wie erbt man also Objektmitglieder?

2.3 Vererbung kopieren

Kopieren Sie alle Eigenschaften und Methoden des übergeordneten Objekts in das untergeordnete Objekt, um eine Vererbung zu erreichen.

Code:

Code kopieren Der Code lautet wie folgt:

Funktion Stu(Name, Punktzahl) {
This.name = Name,
This.score = Punktzahl
}
Funktion Grade() {}
Grade.prototype.code = "Junior High School";
}
//Funktionskapselung
Funktion verlängern(C, P) {
          var p = P.prototype;
          var c = C.prototype;
für (var i in p) {
                     c[i] = p[i];
            }
}
verlängern(Stu, Note);
        var stu1 = new Stu("张三", 80);
        var stu2 = new Stu("李思", 90);
         stu1.code='High School';
console.log(stu1.code); // High School
console.log(stu2.code); // Junior High School
console.log(Stu.prototype.constructor);
console.log(Grade.prototype.constructor)

Das ist alles für die objektorientierte Organisation von js. Dieses Ding ist nicht statisch. Sie können bei der Verwendung Änderungen entsprechend Ihren eigenen Bedürfnissen vornehmen. Es gibt ein Sprichwort, das sehr gut ist, das Richtige ist das Beste.

Hier analysieren wir nur Kapselung und Vererbung. Wir werden in Zukunft einige weitere Artikel verfassen, um Ihnen ein tieferes Verständnis der objektorientierten JavaScript-Programmierung zu vermitteln. Natürlich handelt es sich hierbei um persönliche Absprachen. Sollten Sie Auslassungen feststellen, nehmen Sie bitte Kontakt mit mir auf.