JavaScript-klasse
ECMAScript 2015, ook bekend as ES6, het JavaScript-klasse bekendgestel.
JavaScript-klasse is sjablone vir JavaScript-objekte.
JavaScript-klassintaksis
Gebruik die sleutelwoord classom 'n klas te skep.
Voeg altyd 'n metode by met die naam constructor():
Sintaksis
class ClassName {
constructor() { ... }
}
Voorbeeld
class Car {
constructor(name, year) {
this.name = name;
this.year = year;
}
}
Die voorbeeld hierbo skep 'n klas met die naam "Kar".
Die klas het twee aanvanklike eienskappe: "naam" en "jaar".
'n JavaScript-klas is nie 'n objek nie.
Dit is 'n sjabloon vir JavaScript-objekte.
Die gebruik van 'n klas
Wanneer jy 'n klas het, kan jy die klas gebruik om voorwerpe te skep:
Voorbeeld
let myCar1 = new Car("Ford", 2014);
let myCar2 = new Car("Audi", 2019);
Die voorbeeld hierbo gebruik die Car-klas om twee Car-objekte te skep .
Die konstruktormetode word outomaties genoem wanneer 'n nuwe voorwerp geskep word.
Die Konstruktor Metode
Die konstruktor metode is 'n spesiale metode:
- Dit moet die presiese naam "konstruktor" hê
- Dit word outomaties uitgevoer wanneer 'n nuwe voorwerp geskep word
- Dit word gebruik om voorwerpeienskappe te inisialiseer
As jy nie 'n konstruktormetode definieer nie, sal JavaScript 'n leë konstruktormetode byvoeg.
Klasmetodes
Klasmetodes word geskep met dieselfde sintaksis as objekmetodes.
Gebruik die sleutelwoord classom 'n klas te skep.
Voeg altyd 'n constructor()metode by.
Voeg dan enige aantal metodes by.
Sintaksis
class ClassName {
constructor() { ... }
method_1() { ... }
method_2() { ... }
method_3() { ... }
}
Skep 'n klasmetode genaamd "ouderdom", wat die motorouderdom terugstuur:
Voorbeeld
class Car {
constructor(name, year) {
this.name = name;
this.year = year;
}
age() {
let date = new Date();
return date.getFullYear() - this.year;
}
}
let myCar = new Car("Ford", 2014);
document.getElementById("demo").innerHTML =
"My car is " + myCar.age() + " years old.";
U kan parameters na klasmetodes stuur:
Voorbeeld
class Car {
constructor(name, year) {
this.name = name;
this.year = year;
}
age(x) {
return x - this.year;
}
}
let date = new Date();
let year = date.getFullYear();
let myCar = new
Car("Ford", 2014);
document.getElementById("demo").innerHTML=
"My car is
" + myCar.age(year) + " years old.";
Blaaierondersteuning
Die volgende tabel definieer die eerste blaaierweergawe met volle ondersteuning vir Klasse in JavaScript:
| Chrome 49 | Edge 12 | Firefox 45 | Safari 9 | Opera 36 |
| Mar, 2016 | Jul, 2015 | Mar, 2016 | Oct, 2015 | Mar, 2016 |
"gebruik streng"
Die sintaksis in klasse moet in "streng mode" geskryf word.
Jy sal 'n fout kry as jy nie die "streng modus" reëls volg nie.
Voorbeeld
In "streng modus" sal jy 'n fout kry as jy 'n veranderlike gebruik sonder om dit te verklaar:
class Car {
constructor(name, year) {
this.name = name;
this.year = year;
}
age() {
// date = new Date(); // This will not work
let date = new Date(); // This will work
return date.getFullYear() - this.year;
}
}
Kom meer te wete oor "streng modus" in: JS Streng modus .