Was ist eine JavaScript-Klasse und wie wird sie verwendet?

Bei der objektorientierten Programmierung ist eine Klasse eine erweiterbare Programmcodevorlage zum Erstellen von Objekten. Klassen können in erster Linie als syntaktischer Zucker über die vorhandene prototypbasierte Vererbung von JavaScript betrachtet werden. In diesem Artikel werden wir uns mit der Tiefe der JavaScript-Klasse befassen und lernen, wie man sie in der folgenden Reihenfolge verwendet:

• Was ist eine JavaScript-Klasse?
• Wie verwende ich die JavaScript-Klasse?
  • Definieren Sie eine Klasse
  • Methoden definieren
  • Eine Klasse erweitern

Was ist eine JavaScript-Klasse?

In JavaScript ist eine Klasse eine Art von Funktion und wird mit dem Schlüsselwort class deklariert. Sie müssen die Funktionsausdruckssyntax verwenden, um eine Funktion zu initialisieren, und die Klassenausdruckssyntax, um eine Klasse zu initialisieren.

// Eine Funktion mit einem Funktionsausdruck initialisieren const a = function () {}

// Eine Klasse mit einem Klassenausdruck initialisieren const b = class {}

In JavaScript verwenden wir anstelle der Schlüsselwortfunktion zum Initiieren die Schlüsselwortklasse. Außerdem werden die Eigenschaften innerhalb einer constructor () -Methode zugewiesen.

Wie verwende ich eine JavaScript-Klasse?

Der mit deklarierte Code Funktion und Klasse geben beide eine Funktion zurück. Bei Prototypen kann jede Funktion mithilfe des neuen Schlüsselworts zu einer Konstruktorinstanz werden. Beispielsweise:

const a = class {} // Initialisiere einen Konstruktor aus einer Klasse const constructorFromClass = new a () console.log (constructorFromClass)

Ausgabe:

Python konvertiert Nummer in Binär

ein {} Konstruktor: Klasse

Jetzt gibt es drei verschiedene Möglichkeiten, Klassen in JavaScript zu verwenden. Lassen Sie uns anhand eines Beispiels auf die Details der einzelnen Methoden eingehen.

Definieren Sie eine Klasse

Eine Konstruktorfunktion wird mit einer Reihe von Parametern initialisiert, die als Eigenschaften von zugewiesen werden 'Dies' unter Bezugnahme auf die Funktion selbst. Der erste Buchstabe des Bezeichners wird durch Konvention großgeschrieben.

// Initialisieren einer Konstruktorfunktion Funktion Mitarbeiter (Name, Empid) {this.name = Name this.empid = Empid}

Wenn wir dies nun in die Klassensyntax übersetzen, werden Sie feststellen, dass die Strukturen sehr ähnlich sind.

// Initialisieren einer Klassendefinition Klasse Mitarbeiter {Konstruktor (Name, Empid) {this.name = Name this.empid = Empid}}

Wir können sagen, dass das Schlüsselwort class auf einfachere Weise kommuniziert. Der einzige Unterschied in der Syntax der Initialisierung besteht darin, das Schlüsselwort class anstelle der Funktion zu verwenden. Außerdem werden die Eigenschaften innerhalb einer constructor () -Methode zugewiesen.

Methoden definieren

Eine andere übliche Praxis bei Konstruktorfunktionen ist das Zuweisen Methoden direkt zum Prototyp statt in der Initialisierung. Wir werden ein Beispiel nehmen und sehen, wie es funktioniert:

function employee (name, empid) {this.name = name this.empid = empid} // Hinzufügen einer Methode zum Konstruktor employee.prototype.greet = function () {return `$ {this.name} sagt hallo.`}

Wenn Sie denselben Code mit Klasse schreiben, wird dieser vereinfacht und die Methode direkt hinzugefügt.

Klassenangestellter {Konstruktor (Name, Empid) {this.name = Name this.empid = Empid} // Hinzufügen einer Methode zum Konstruktor greet () {return `$ {this.name} sagt Hallo.`}}

Obwohl Klassen eine einfachere und prägnantere Syntax ermöglichen, müssen Sie manchmal Kompromisse bei der Klarheit des Prozesses eingehen.

Eine Klasse erweitern

Der Vorteil von Konstruktorfunktionen und -klassen besteht darin, dass sie basierend auf dem übergeordneten Element in neue Objektpläne erweitert werden können. Dies hilft bei der Verhinderung der Wiederholung von Code für Objekte, die ähnlich sind, aber einige zusätzliche oder spezifischere Funktionen benötigen.

Neue Konstruktorfunktionen können mit der Methode call () aus dem übergeordneten Element erstellt werden. Beispielsweise:

// Erstellen eines neuen Konstruktors aus den übergeordneten Funktionsinformationen (Name, Empid, Gehalt) {// Kettenkonstruktor mit Aufruf employee.call (this, Name, empid) this.salary = Gehalt}

Wenn wir jetzt denselben Code mit class schreiben, wird anstelle des Aufrufs das Schlüsselwort super verwendet, um auf die übergeordneten Funktionen zuzugreifen.

// Das Erstellen einer neuen Klasse aus den Informationen der übergeordneten Klasse erweitert den Mitarbeiter {Konstruktor (Name, Empid, Gehalt) {// Kettenkonstruktor mit Super Super (Name, Empid) // Füge eine neue Eigenschaft hinzu this.salary = Gehalt}}

Klassen bieten Ihnen eine präzisere Möglichkeit zum Erstellen Objekt Blaupausen und Konstruktorfunktionen beschreiben genauer, was unter der Haube geschieht.

Damit sind wir am Ende unseres Artikels angelangt. Ich hoffe, Sie haben verstanden, wie man JavaScript Class verwendet.

Nachdem Sie sich mit JavaScript Class vertraut gemacht haben, lesen Sie die von Edureka. Mit dem Web Development Certification Training lernen Sie, wie Sie beeindruckende Websites mit HTML5-, CSS3-, Twitter Bootstrap 3-, jQuery- und Google-APIs erstellen und für Amazon Simple Storage Service (S3) bereitstellen.

Hast du eine Frage an uns? Bitte erwähnen Sie es im Kommentarbereich von 'JavaScript Class' und wir werden uns bei Ihnen melden.