1. Übersicht Das Konzept der Klasse ist ein Konzept, das grundsätzlich alle objektorientierten Programmiersprachen haben, wie etwa 2. Definieren Sie eine einfache KlasseIn TS wird das Schlüsselwort class auch zum Definieren einer Klasse verwendet. Der Beispielcode lautet wie folgt: ;(Funktion () { // Klasse definieren class Person { // Öffentliche Attribute, können standardmäßig weggelassen werden öffentlicher Name: Zeichenfolge // Konstruktor Konstruktor(Name: Zeichenfolge) { // Initialisiere die Namenseigenschaft this.name = name } } //Klasse instanziieren const person = new Person('Yiwan Zhou') Konsole.log(Person.Name) // Yiwan Zhou})() Die oben definierte Klasse hat einen Konstruktor und einen öffentlichen Attributnamen. Wenn die Klasse instanziiert wird, wird der Konstruktor aufgerufen, um die funktionalen Attribute zu initialisieren. Es gibt auch eine Kurzform des oben genannten, wie unten gezeigt: ;(Funktion () { Klasse Person { Konstruktor (öffentlicher Name: Zeichenfolge) {} } //Klasse instanziieren const person = new Person('Yiwan Zhou') Konsole.log(Person.Name) // Yiwan Zhou})() Dies entspricht dem obigen. 3. VererbungEines der wichtigsten Merkmale objektorientierter Programmiersprachen ist die Vererbung. Vererbung dient der Erweiterung einer bestehenden Klasse auf Basis einer bestimmten Klasse. Wenn beispielsweise ein Vater ein Hofhaus in Peking besitzt, kann sein Sohn das Hofhaus seines Vaters erben und zusätzlich für sich selbst eine Villa kaufen; am Ende besitzt der Sohn ein Hofhaus und eine Villa in Peking. In TS wird für die Vererbung das Schlüsselwort extends verwendet. Der Beispielcode lautet wie folgt: ;(Funktion () { // Definieren Sie eine Basisklasse, auch Superklasse genannt class Person { // Definieren Sie eine Namenseigenschaft im Konstruktor der Basisklasse (öffentlicher Name: Zeichenfolge) {} } // Definieren Sie eine abgeleitete Klasse, auch Unterklasse genannt, die von der Basisklasse erbt class Programmer extends Person { Konstruktor(Name: Zeichenfolge, öffentliches Hobby: Zeichenfolge) { // Rufen Sie den Basisklassenkonstruktor super(name) über super auf } } // Unterklasse instanziieren const programmer = new Programmer('Programmierer', 'coding') console.log(programmer.name, programmer.hobby) // Eine Schüssel wöchentliches Coding })() Im obigen Beispielcode wird Im obigen Beispiel erbt Im Konstruktor der Unterklasse müssen wir die Methode Durch die Klassenvererbung können Sie nicht nur Klassen erben, sondern auch die Eigenschaften oder Methoden der übergeordneten Klasse in der untergeordneten Klasse überschreiben. Der Beispielcode lautet wie folgt: //Definiere eine Personenklasse class Person { Konstruktor (öffentlicher Name: Zeichenfolge) {} //Definiere eine Methode sayMy() { console.log(`Mein Name: ${this.name}`) } } // Definieren Sie eine Erwachsenenklasse, die von der Personenklasse erbt class Adult extends Person { Konstruktor(öffentliches Alter: Zahl) { super('die andere Seite ist wohlhabend') } // Überschreibe die Methode der übergeordneten Klasse sayMy() { console.log(`Mein Name: ${this.name} Alter: ${this.age}`) } } // Definieren Sie eine Programmierer-Klasse, die von der Erwachsenen-Klasse erbt class Programmer extends Adult { Konstruktor(öffentliches Hobby: Zeichenfolge) { super(18) } // Überschreibe die Methode der übergeordneten Klasse sayMy() { konsole.log( `Mein Name: ${this.name} Alter: ${this.age} Hobby: ${this.hobby}` ) } } // Klasseninstanzierung const programmer = new Programmer('coding') programmer.sayMy() // Mein Name: Bi'an Fanhua Alter: 18 Hobbys: Programmieren Zuerst haben wir eine 4. öffentliche, private und geschützte ModifikatorenDer Unterschied zwischen öffentlichen, privaten und geschützten Modifikatoren:
Der Beispielcode lautet wie folgt: // Definieren Sie eine Personenklasse, die öffentliche, private und geschützte Mitglieder enthält. Klasse Person { öffentlicher Name: Zeichenfolge // Es besteht allgemein Einigkeit darüber, dass private Mitglieder mit _ private _age: number beginnen. geschütztes Hobby: Schnur // Initialisierungskonstruktor der Eigenschaft (Name: Zeichenfolge, Alter: Zahl, Hobby: Zeichenfolge) { dieser.name = Name this._age = Alter dieses.hobby = hobby } sagMein() { console.log(dieser.Name, dieses._Alter, dieses.Hobby) } } // Instanziieren Sie die Klasse „Person“ const person = new Person('Person', 18, 'coding') console.log(person.name) // Zurück zur Klasse//Der Zugriff auf private Member außerhalb der Klasse löst eine Ausnahme aus// console.log(person._age) // Fehler melden//Der Zugriff auf geschützte Member außerhalb der Klasse löst eine Ausnahme aus// console.log(person.hobby) // Fehler melden//Auf private und geschützte Member kann innerhalb der Klasse zugegriffen werden person.sayMy() // Zurück zur Klasse18 Codierung // Definiere eine Klasse die von der Klasse Person erbt class Programmer extends Person { Konstruktor(Name: Zeichenfolge, Alter: Zahl, Hobby: Zeichenfolge) { super(Name, Alter, Hobby) } sagMein() { console.log(this.name) // Fehlerbericht// Auf private Member der Elternklasse kann in der Unterklasse nicht zugegriffen werden // console.log(this._age) // Fehlerbericht// Auf geschützte Member kann in der Unterklasse zugegriffen werden console.log(this.hobby) // coding } } // Instanziieren Sie die Klasse „Programmer“ const programmer = new Programmer('Programmierer', 18, 'coding') programmierer.sayMy() // Stellen Sie sicher, dass kein Konflikt mit Mitgliedern in anderem Code auftritt. Export {} Wie im obigen Code gezeigt, können wir in der Basisklasse auf öffentliche Mitglieder, private Mitglieder und geschützte Mitglieder zugreifen, außerhalb der Klasse können wir jedoch nur auf öffentliche Mitglieder zugreifen. Wenn wir eine Unterklasse definieren, die von der Klasse 4.1Getter und Setter Wir können private und geschützte Mitglieder einer Klasse lesen und schreiben. TS bietet Der Beispielcode lautet wie folgt: //Definiere eine Personenklasse class Person { // Es wird vereinbart, dass private Mitglieder normalerweise mit _ private _name: string beginnen // Initialisierungskonstruktor der Eigenschaft (Name: Zeichenfolge) { dieser._name = Name } // Den privaten Wert des Attributs _name abrufen get getName(): string { gib dies zurück._name } // Setze den privaten _name-Eigenschaftswert set setName(name: string) { dieser._name = Name } } // Instanziieren Sie die Klasse const person = new Person('eine Schüssel Haferbrei') // Mit getName abrufen console.log(person.getName) // Eine Schüssel Haferbrei // Den Wert von _name mit setName festlegen person.setName = 'Eine Schüssel Haferbrei' // Console.log(person.getName) erneut abrufen // Yiwan Zhou 5. Nur-Lese-Modifikator Mit dem Modifikator Der Beispielcode lautet wie folgt: // Definieren Sie eine Klasse mit einem schreibgeschützten Attribut class Person { // schreibgeschützter Name: Zeichenfolge // entspricht // öffentlichem schreibgeschütztem Namen: Zeichenfolge // Konstruktor(Name: Zeichenfolge) { // dieser.name = Name // } // oder Konstruktor (öffentlicher schreibgeschützter Name: Zeichenfolge) {} } // Instanziierung const person = new Person('Person') console.log(person.name) // person.name// Wert von „name“ ändern// person.name = „person.name“ // Fehler! „name“ ist schreibgeschützt. 6. Statische Mitglieder In TS können wir auch statische Mitglieder erstellen. Diese Eigenschaften oder Methoden existieren in der Klasse selbst und nicht in der Instanz der Klasse. Das Definieren statischer Mitglieder in TS ist dasselbe wie in ES6, beide verwenden zur Anzeige das Schlüsselwort Der Beispielcode lautet wie folgt: Klasse Held { // Zähler statisch count = 0 Konstruktor (öffentlicher Name: Zeichenfolge) { // Jedes Mal eine Eigenschaftsanzahl erstellen ++ ++Heldenzahl } } // Instanziieren Sie eine Heldenklasse const hero1 = new Hero('Sun Wukong') konsole.log(Hero.count) // 1 const hero2 = neuer Held('Nezha') Konsole.log(Hero.count) // 2 Hier verwenden wir statische Eigenschaften, um einen Zähler zu implementieren, der mehrere instanziierte Klassen aufzeichnet. 7. Abstrakte KlasseUm zu verstehen, was eine abstrakte Klasse ist, müssen Sie zunächst verstehen, was Abstraktion ist. Die sogenannte Abstraktion besteht darin, gemeinsame und wesentliche Merkmale aus vielen Dingen zu extrahieren und ihre nicht wesentlichen Merkmale zu verwerfen. Beispielsweise haben Äpfel, Bananen, rohe Birnen, Weintrauben, Pfirsiche usw. alle das gemeinsame Merkmal, dass es sich um Früchte handelt. Der Prozess der Entwicklung des Fruchtbegriffs ist ein abstrakter Prozess. Eine abstrakte Klasse extrahiert die gemeinsamen Funktionen aus vielen Klassen und erstellt eine separate Klasse, die als Basisklasse für andere abgeleitete Klassen verwendet werden kann. Sie dürfen nicht instanziiert werden und abstrakte Klassen werden mit dem Schlüsselwort Eine abstrakte Methode hat nur die Definition der Methode, aber keinen Methodenkörper. Der Methodenkörper muss in der Unterklasse implementiert werden. Der Beispielcode lautet wie folgt: // Verwenden Sie das Schlüsselwort abstract, um eine abstrakte Klasse zu definieren, die nicht initialisiert werden muss und nur als Basisklasse verwendet wird. abstract class Department { // Initialisieren Sie das Namenselement, Parameterattributkonstruktor (öffentlicher Name: Zeichenfolge) {} Druckname(): void { console.log('Abteilungsname: ' + dieser.name) } // Abstrakte Methoden müssen das Schlüsselwort abstract enthalten abstract printMeeting(): void // Muss in abgeleiteten Klassen implementiert werden} Klasse AccountingDepartment erweitert Department { Konstruktor() { super('Buchhaltungsabteilung') // Sie müssen super() im Konstruktor einer abgeleiteten Klasse aufrufen } druckeMeeting(): void { console.log('Die Buchhaltungsabteilung ist für die Verwaltung des Geldes verantwortlich.') } } // const department = new Department() // Löst eine Exception aus: Es kann keine Instanz einer abstrakten Klasse erstellt werden // Instanziiere abstrakte Unterklasse const department = new AccountingDepartment() // Rufen Sie die Methode in der abstrakten Klasse department.printName() auf. // Name der Abteilung: Buchhaltungsabteilung. // Rufen Sie die abstrakte Methode auf, die in der abgeleiteten Klasse department.printMeeting() implementiert ist. // Die Buchhaltungsabteilung ist die Abteilung, die für die Verwaltung des Geldes zuständig ist. 8. Klassen und SchnittstellenDie Klassendefinition erstellt zwei Dinge: den Instanztyp der Klasse und einen Konstruktor. Da Klassen Typen erstellen können, ähnelt dies der Schnittstelle, die wir zuvor kennengelernt haben. Daher können wir Klassen dort verwenden, wo Schnittstellen verwendet werden. Der Beispielcode lautet wie folgt: //Definiere eine Klasse class Point { x: Zahl y: Zahl } // Definieren Sie eine Schnittstellenvererbung und eine Klassenschnittstelle Point3d extends Point { z: Zahl } lass point3d: Point3d = { x: 1, y: 2, z: 3 } Eine Klasse kann eine Schnittstelle implementieren, indem sie diese implementiert. Der Beispielcode lautet wie folgt: // definiere Schnittstelle Eat { essen(Nahrung: Zeichenfolge): void } Schnittstelle Ausführen { Lauf(Entfernung: Zahl): void } // Klasse definieren um Schnittstellenklasse zu implementieren Person implements Eat, Run { essen(Nahrung: Zeichenfolge): void { console.log(Essen) } lauf(Entfernung: Zahl) { console.log(Entfernung) } } exportieren {} Dies ist das Ende dieses Artikels über Klassen in TypeScript. Weitere relevante Inhalte zu TypeScript-Klassen finden Sie in den vorherigen Artikeln von 123WORDPRESS.COM oder in den folgenden verwandten Artikeln. Ich hoffe, dass jeder 123WORDPRESS.COM in Zukunft unterstützen wird! Das könnte Sie auch interessieren:
|
<<: So schreiben Sie mithilfe von Filtern transparentes CSS für Bilder
>>: Zwei Verwendungen von iFrame-Tags in HTML
1. Befehlseinführung Mit dem Befehl cal (Kalender...
Inhaltsverzeichnis einführen Objektattribute in R...
Inhaltsverzeichnis Verschiedene Möglichkeiten zum...
Inhaltsverzeichnis Cache-Funktion in vue2 Transfo...
Verwenden Sie den Linux-Befehl chmod , um zu steu...
Vorwort In den meisten Projekten werden Sie auf e...
Gestern gab es keine Probleme beim Herstellen ein...
Der erste Cutter in China github.com/chokcoco Hie...
Problem: Der Überlauf der Auto-Increment-ID in ei...
Stellen Sie die MySQL-Umgebung lokal bereit (192....
1. Entpacken Sie die heruntergeladene Datei wie u...
Nginx ist ein leistungsstarker, leistungsstarker ...
Frage Wie können wir bei einer bestimmten MySQL-V...
1. Entpacken Sie die Datei in das aktuelle Verzei...
1. Globales Objekt Alle Module können aufgerufen ...