Inhaltsverzeichnis
Einführung in den Unterricht
Statische Methoden und statische Eigenschaften
Heim Web-Frontend js-Tutorial Fassen Sie die Wissenspunkte der Klasse in ES6 zusammen und organisieren Sie sie

Fassen Sie die Wissenspunkte der Klasse in ES6 zusammen und organisieren Sie sie

Aug 08, 2022 pm 03:09 PM
es6

Dieser Artikel vermittelt Ihnen relevantes Wissen über Javascript. Er führt hauptsächlich in das Konzept der Klasse ein, das mit dem Schlüsselwort „class“ übereinstimmt Bei den objektorientierten Sprachen, die wir normalerweise verstehen, hoffe ich, dass es für alle hilfreich ist.

Fassen Sie die Wissenspunkte der Klasse in ES6 zusammen und organisieren Sie sie

【Verwandte Empfehlungen: Javascript-Video-Tutorial, Web-Frontend

Einführung in den Unterricht

Traditionelles JS hat nur das Konzept von Objekten und kein Konzept von Klassen, da JS objektorientiert ist Eine auf Prototypen basierende Sprache. Das Merkmal von Prototypobjekten ist, dass sie alle Eigenschaften mit neuen Objekten teilen.

ES6 führt das Konzept der Klasse ein. Klassen können über das Schlüsselwort class definiert werden. Dies ist eine objektorientierte Sprache, die eher dem entspricht, was wir normalerweise verstehen.

class Person{   //定义一个名为Person的类
    // 构造函数,用来接受参数
    constructor(x,y){
        this.x = x;    //this代表的是实例对象
        this.y = y;
    }
    todoSome(){  //这是个类的方法,不需要加function,有多个方法也不用逗号隔开
        alert(this.x + "的年龄是" +this.y+"岁");
    }
}
export default  Person;
Nach dem Login kopieren

Statische Methoden und statische Eigenschaften

Statische Methoden und statische Eigenschaften sind Eigenschaften und Methoden, die das statische Schlüsselwort verwenden Dies zeigt beim Aufruf der statischen Methode

auf die Klasse, nicht auf die Instanz der Klasse. Daher können

statische Methoden nur über Klassennamen aufgerufen werden, nicht über Instanzen.
static classMethod(){
		console.log('123456')
	}
Nach dem Login kopieren

Statische Eigenschaften aufgerufen durch Wird vom Klassennamen aufgerufen und kann nicht von der Instanz der Klasse aufgerufen werden
  • Klassenvererbung erweitert
  • Klasse kann mit dem Schlüsselwort „Extens“ geerbt werden
ES6-Vererbung, super() muss im Unterklassenkonstruktor verwendet werden . Da die ES6-Vererbung zunächst die Attribute und Methoden des Instanzobjekts der übergeordneten Klasse hinzufügt und dann den Konstruktor der Unterklasse aufruft, um diese zu ändern, fügt super () diese standardmäßig hinzu Die Unterklasse erbt die Methoden und Attribute der übergeordneten Klasse, aber die statischen Methoden und Attribute müssen über den Klassennamen der Unterklasse aufgerufen werden. Der Wertfunktions-Getter und der Speicherfunktions-Setter der Klasse. Getter und Setter sind die angegebenen Attribute Die Klasse wird zum Lesen und Übergeben von Werten verwendet.

Der Wertfunktions-Getter und der Speicherfunktions-Setter können die Zuweisung und das Werteverhalten anpassen. Wenn eine Eigenschaft nur einen Getter und keinen Setter hat, ist die Eigenschaft eine schreibgeschützte Eigenschaft und kann weder einem Wert zugewiesen noch initialisiert werden erstmals. Wenn die Variable als privat definiert ist (definiert außerhalb der geschweiften Klammern der Klasse), können Sie nur Getter ohne Setter verwenden.
let p = new Point();
p.classMethod();  // 报错
Nach dem Login kopieren

    Verwendung:
  • static prop = 1 ;  // 静态属性
    Nach dem Login kopieren
  • Hinweise:
  • 1. Wenn Sie eine Methode in einer Klasse definieren, können Sie der Methode kein Funktionsschlüsselwort hinzufügen, da der Konstruktor in JS mit Funktion definiert ist und die beiden es sind getrennt.

    2. Trennen Sie nicht alle Methoden durch Kommas, da sonst ein Fehler gemeldet wird.
    • 【Verwandte Empfehlungen:
    • Javascript-Video-Tutorial
    • ,
    • Web-Frontend

    Das obige ist der detaillierte Inhalt vonFassen Sie die Wissenspunkte der Klasse in ES6 zusammen und organisieren Sie sie. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Heiße Artikel -Tags

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version

SublimeText3 chinesische Version

Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

So kehren Sie ein Array in ES6 um So kehren Sie ein Array in ES6 um Oct 26, 2022 pm 06:19 PM

So kehren Sie ein Array in ES6 um

Ist Async für es6 oder es7? Ist Async für es6 oder es7? Jan 29, 2023 pm 05:36 PM

Ist Async für es6 oder es7?

So finden Sie in es6 verschiedene Elemente in zwei Arrays So finden Sie in es6 verschiedene Elemente in zwei Arrays Nov 01, 2022 pm 06:07 PM

So finden Sie in es6 verschiedene Elemente in zwei Arrays

Warum muss das Miniprogramm es6 in es5 konvertieren? Warum muss das Miniprogramm es6 in es5 konvertieren? Nov 21, 2022 pm 06:15 PM

Warum muss das Miniprogramm es6 in es5 konvertieren?

Ist eine es6-Syntax erforderlich? Ist eine es6-Syntax erforderlich? Oct 21, 2022 pm 04:09 PM

Ist eine es6-Syntax erforderlich?

Ist es2015 dasselbe wie es6? Ist es2015 dasselbe wie es6? Oct 25, 2022 pm 06:51 PM

Ist es2015 dasselbe wie es6?

Ist die ES6-Karte bestellt? Ist die ES6-Karte bestellt? Nov 03, 2022 pm 07:05 PM

Ist die ES6-Karte bestellt?

Was bedeutet die temporäre Totzone von es6? Was bedeutet die temporäre Totzone von es6? Jan 03, 2023 pm 03:56 PM

Was bedeutet die temporäre Totzone von es6?

See all articles