Entdecken Sie Möglichkeiten zur Implementierung von Klassen in JavaScript

Besprechen Sie die Möglichkeiten zur Implementierung von Klassen in JavaScript

Es gibt viele Möglichkeiten, Objekte in Javascript zu erstellen, daher ist die Art und Weise, Objekte zu erstellen, sehr flexibel. Welche Methode eignet sich also am besten zum Erstellen von Objekten? Konstruktionsmodus

, Prototypmodus oder Objektliteralmodus?

Aber was genau sind diese Modi?

Bevor wir mit der Erklärung beginnen, lassen Sie uns die Grundkenntnisse über Javascript klar vorstellen.

Ist es möglich, objektorientierte Programmierung in Javascript zu implementieren?

Die Antwort ist möglich, Javascript kann Objekte erstellen! Solche Objekte können Daten und Methoden enthalten, die die Daten manipulieren können, und können sogar andere Objekte enthalten. Es hat keine Klasse, aber einen Konstruktor

; es hat keinen Klassenvererbungsmechanismus, aber die Vererbung kann durch Prototypen erreicht werden.

Jetzt scheinen wir die notwendigen Komponenten verstanden zu haben, um Objekte zu erstellen und objektbasierte Programmierung in Javascript zu implementieren.

Wir alle wissen, dass Javascript private Variablen hat. Auf eine über das Schlüsselwort „var“ definierte Variable kann nur innerhalb des Funktionskörpers und nicht außerhalb der Funktion zugegriffen werden. Was passiert also, wenn

wir Variablen nicht mit dem Schlüsselwort „var“ definieren? Wir werden dieses Thema jetzt nicht ausführlicher besprechen. Es kann über „dies“ erreicht werden. Ich werde zu einem anderen Zeitpunkt ausführlich auf dieses Thema eingehen.

Nun zurück zur vorherigen Frage. Welche Methode eignet sich am besten zum Erstellen von Objekten?

Lassen Sie uns das bereits vorhandene Wissen nutzen und es ausprobieren, indem wir ein Personenobjekt erstellen.

[javascript]

var Person = {

Vorname: 'John',

Nachname: 'Cody',

fullName : '',

message : '',

createFullName: function () {

fullName = this.firstName + ' ' + this.lastName;

getMessage : function () {

this.createFullName(); this.message + ' ' + fullName ;

}

Person.firstName = 'Eli'; .lastName = 'Flowers'

Person.changeMessage('welcome');

var message = Person.getMessage(); // willkommen Eli Flowers

alert(message );

Dies ist das wörtliche Muster des Objekts. Dies kommt der Art und Weise, wie wir normalerweise Objekte erstellen, sehr nahe. Wenn Sie sich nicht um private/umschlossene Mitglieder kümmern müssen und wissen, dass keine Instanzen dieses Objekts erstellt werden. Dann ist diese Methode genau das Richtige für Sie. Öffentliche Mitglieder können alles tun, was private Mitglieder tun können, oder? Dies ist jedoch keine Klasse, sondern ein Objekt. Es kann nicht instanziiert und nicht vererbt werden.

Lass uns etwas anderes ausprobieren:

[javascript]

var Person = function() {

this.firstName = 'John';

this.lastName = 'Cody'

var fullName = ''; >

var _that = this;

var createFullName = function () {

fullName = _that.firstName + ' ' + _that .lastName; 🎜> }

this.getMessage = function () {

createFullName();

return this.message + ' ' + fullName;

}

}

var person1 = new Person();

person1. firstName = ' Eli';

person1.lastName = 'Flowers'

person1.changeMessage('welcome'); / Willkommen Eli Flowers

alert(message);

Dies ist eine Instanz von Constructor Pattern. Ist das also eine Klasse oder ein Objekt? Wahrscheinlich beides. Auf Anfrage können wir es als Objektperson

behandeln

zu verwenden. Schließlich ist es nur eine Funktion. Es ist jedoch möglich, mit dem Schlüsselwort „new“ neue Instanzen zu erstellen.

Bei der Verwendung dieser Methode müssen wir immer die folgenden Punkte beachten:

1. Wann immer diese Funktion aufgerufen wird, hat sie eine Besonderheit Variable namens „this“, die global verfügbar ist. Der globale Geltungsbereich hängt vom

Geltungsbereich der Funktion selbst ab.

2. Immer wenn eine Instanz dieser Funktion über das Schlüsselwort „new“ erstellt wird, zeigt die Variable „this“ auf die Funktion selbst, und dieser „neue“ Vorgang wirkt sich auf die Funktion aus body Der Code in

wird ausgeführt. Dies ist auch das Konstruktionsmuster.

3. Alle an die Variable „this“ angehängten Variablen werden zu öffentlichen Eigenschaften und alle über das Schlüsselwort „var“ definierten Variablen werden zu privaten Eigenschaften.

4. Eine an „this“ angehängte Funktion wird als privilegierte Funktion bezeichnet. Sie kann auf alle privaten Variablen sowie auf Funktionen und Variablen zugreifen, die an „this“ angehängt sind.

5. Private Funktionen können auf andere private Variablen und private Funktionen zugreifen.

6. Private Funktionen können nicht direkt auf Variablen und Funktionen zugreifen, die an „this“ angehängt sind. Wir können dies tun, indem wir eine private Variable „_that“ erstellen und ihr den Wert „this“ zuweisen.

7. Alle privaten Variablen und Funktionen stehen anderen privaten Funktionen und anderen mit „this“ verknüpften Funktionen zur Verfügung. Dies ist im Rahmen von JavaScript durchaus möglich.

8. Eine Variable: nicht über das Schlüsselwort „var“ oder an die Variable „this“ angehängt, um einen globalen Gültigkeitsbereich zu erhalten. Zum Beispiel für den Umfang einer benutzerdefinierten Funktion. Brauchen Sie

, um das Wissen über Umfang und Cluster wieder zu verstehen.

Dies hat das meiste von dem erreicht, was wir wollen, aber manchmal können die beiden Eingabevariablen „dies“ und „das“ leicht zu Verwirrung führen. Besonders für diejenigen, die immer darauf bestanden haben,

auf reine Privatsphäre zu bestehen, ist es einfacher, sich zu verwirren.

Lass es uns mit einer kleinen Modifikation versuchen.

[javascript]

var Person = function () {

//private

var firstName = 'John';

var lastName = ''

var message = ''; >

var createFullName = function () {

fullName = firstName + ' ' + lastName;

} }

//öffentliche Setter

var setMessage = function (msg) {

message = msg;

} }

var setFirstName = function (fName ) {

firstName = fName;

}

var setLastName = function (lName) {

lastName = lName

}

var getMessage = function () {

createFullName();

return message + ' ' + fullName

}

//Funktionen öffentlich zugänglich gemacht

return {

setFirstName: setFirstName,

setLastName: setLastName ,

setMessage: setMessage,

getMessage: getMessage

};

}; >

var person1 = new Person();

person1.setFirstName('Eli'); >

person1.setMessage('welcome');

var message = person1.getMessage(); // willkommen Eli Flowers

alert(message);

Dies ist ein aufschlussreiches Muster. Vielen Dank an Christian Heilmann. Die Verwendung dieses Musters besteht darin, die „Getter“ und „Setter“ der Anfrage als

als Attribute zu verwenden. Viele von uns haben diese Zahl aus der traditionellen Java-Programmierung gefunden und es ist offensichtlich, dass die Implementierung nicht kompliziert ist. Dies ist auch eine ähnliche Situation wie wenn eine Klasse von einer

-Schnittstelle erbt.

Die meisten Aspekte dieses Modells sind gut umgesetzt, mit nur einem sehr kleinen Problem. Jedes Mal, wenn eine Instanz einer Klasse erstellt wird. Dieses neu erstellte Objekt erhält eine Kopie der Variablen und Funktionen

Eine Kopie von

. Nun ist das Kopieren von Variablen kein Problem. Wir hoffen, dass die Daten jedes Objekts zum Objekt selbst gehören. Was ist also mit den Mitgliedsfunktionen? Sie manipulieren einfach Daten

. Warum müssen Sie sie also kopieren?

Das ist der Vorteil von Prototype. In allen Fällen wird alles als Prototyp erstellt und kann untereinander geteilt werden. Wir müssen lediglich eine öffentliche Funktion basierend auf dem Prototyp

erstellen.

[javascript]

var Person = function () {

//private

var WelcomeMessage = 'Welcome';

var fullName = ''; = function () {

Person.prototype.setFirstName('asdsad');

fullName = firstName + ' ' + lastName; >

//constructor

var Person = function () { } //wird jedes Mal erstellt

//public

Person.prototype = {

getFullName: function () {

createFullName();

return WelcomeMessage + ' ' + fullName; ,

setFirstName: function (fName) {

firstName = fName;

},

setLastName: function (lName) { 🎜>

lastName = lName;

},

ChangeMessage: function (mesg) {

WelcomeMessage = mesg;

}

return new Person(); // Person; //new Person();

; >

var person1 = new Person();

person1.setFirstName('Eli');

person1 . ChangeMessage('welcome');

var message = person1.getFullName(); // willkommen asdsad Flowers

alert(message);

Ein Problem mit dem Prototypmuster besteht darin, dass es nicht auf private Variablen und private Funktionen zugreifen kann. Aufgrund dieses Problems werden wir Abschlüsse einführen und den Code, der in der erstellten Klasse vorhanden ist, immer so organisieren, dass

Es wird global nicht chaotisch. Alle liegen im Bereich der Person-Klasse.

Ein weiteres Problem besteht darin, dass jedes Mal, wenn eine Instanz erstellt wird, der gesamte Code ausgeführt wird, einschließlich der Prototypenbindung. Für einige von uns ist es einfach eine Frage der Effizienz.

Eine Möglichkeit, damit umzugehen, besteht darin, den Prototyp nur zu binden, wenn Sie erwarten, dass die öffentliche Funktion nicht verfügbar ist.

Dadurch wird der Prototyp-Bindungsvorgang nur ausgeführt, wenn die erste Instanz erstellt wird, und alle weiteren Instanzen danach werden nur überprüft. Leider kann dies immer noch nicht

das Problem lösen, das wir im obigen Beispiel erwähnt haben, da wir nur eine neue Funktion erstellen können, um einen Abschluss zu generieren und diesen Klasseneffekt zu erzielen. In diesem Fall reduzieren wir zumindest

einen Teil der Speichernutzung.

Warten Sie, es gibt ein weiteres Problem: Private Funktionen können nicht direkt auf Prototypfunktionen zugreifen.

Warum braucht man private Funktionen und private Variablen? Ich weiß, dass Sie eine Klassenkapselung erreichen und sicherstellen möchten, dass die Attribute oder internen Daten in der Klasse nicht plötzlich geändert oder durch andere interne Programme oder andere Vorgänge geändert werden ...

Sie sollten bedenken, dass Sie Javascript-Code nicht in Binärdateien kompilieren können und dass Sie von dieser Situation bis zu einem gewissen Grad genervt sind. Der Code ist also immer verfügbar. Wenn also

jemand mit dem Code herumspielen will, egal, ob Sie wirklich privat sind oder nicht, ob Sie den Code an andere Mitglieder des Teams weitergeben oder ihn verkaufen, kann er es vermasseln der Code. Die Umsetzung der

Privatisierung kann ein wenig helfen.

Eine andere Technik, die von anderen Programmierern verwendet wird, besteht darin, Konventionen zur Benennung zu verwenden und allem, was Sie privat machen möchten, einen Unterstrich „_“ voranzustellen, um anzugeben, dass es privat ist.

[javascript]

(function () {

    var Person = function () {  

        this._fullName = '';  

        this.welcomeMessage = '';  

        this.firstName = '';  

        this.lastName = "";  

_that = dies;  

  

        this._createFullName = function () {  

            this.ChangeMessage('Namaste');  

            this._fullName = this.firstName + ' ' + this.lastName;  

        };  

    }  

  

    //Gemeinsame Funktionen zur Codeoptimierung  

    Person.prototype = {  

        Konstruktor: Person,  

        getFullName: function () {  

            this._createFullName();  

            return this.welcomeMessage + ' ' + this._fullName;  

        },  

        ChangeMessage: function (mesg) {  

            this.welcomeMessage = mesg;  

        }  

    }  

  

    this.Person = Person;  

})();  

  

var person1 = new Person();  

person1.firstName = 'Eli';  

person1.lastName = 'Blumen';  

person1.ChangeMessage('Welcome');  

var message = person1.getFullName(); // Namaste Eli  Flowers  

alert(message);  

 

我不是说你不应该考虑 „privat“ 或者类似的知识怎么来管理并且知道怎么做才是最好的。根据你的

 

需求,你可以使用任何一种设计模式或者多个设计模式组合一起使用。

 

无论你决定采用哪种设计模式, 始终记住做尽量少的事情, 不要在全局作用范围内实现闭包, 尽量减少内存泄露，以及优化代码，并且组织好

 

代码。所以，尽量多了解些作用域，闭包以及 „this“ 的表现行为。

 

最后，祝编程愉快！

译后感

经常使用 Javascript常好用.从这样文章也明白在 

 javascript 中实现类的各种方式，以及在文章最后讨论了类中私有成员的实现情况.