static
Marque un champ ou une méthode comme appartenant à la classe elle-même, et non aux objets créés avec new.
Exemple
#class Student {
static count = 0
constructor(name) {
this.name = name
Student.count++
}
static compare(a, b) {
return a.name.localeCompare(b.name, 'fr')
}
}
const students = [new Student('Lucas'), new Student('Emma'), new Student('Léa')]
console.log(Student.count)
console.log(students.toSorted(Student.compare).map((student) => student.name))
console.log(students[0].count)L’instance n’a pas de champ count. Il appartient à la classe, donc vous ne pouvez le lire que via Student.count.
Définition et utilisation
#Le mot static devant un champ ou une méthode fait qu’il appartient à la classe, et non à ses instances. Vous y accédez par le nom de la classe, comme avec Math.max() ou Array.from(), sans créer d’objet. Les instances n’ont pas accès aux membres statiques via this.
Les méthodes statiques sont un bon endroit pour des fonctions liées à la classe qui n’ont pas besoin des données d’un objet précis : des méthodes fabriques qui créent des instances d’une façon particulière (Course.fromJSON()), des validateurs, ou des fonctions qui comparent deux instances. Les champs statiques stockent des données communes à toute la classe, par exemple un compteur d’objets créés ou des constantes de configuration.
À l’intérieur d’une méthode statique, this désigne la classe, vous pouvez donc faire référence aux autres membres statiques. Ils sont hérités par les classes dérivées. Un bloc static { } exécute du code une seule fois, pendant la définition de la classe, par exemple pour préparer un champ statique plus complexe.
Syntaxe
#class Name {
static field = value
static #privateField = value
static method() {}
static {
// code exécuté une fois, lors de la définition de la classe
}
}
Name.method()
Name.fieldPlus d’exemples
#class Course {
constructor(title, lessons) {
this.title = title
this.lessons = lessons
}
static fromJSON(json) {
const data = JSON.parse(json)
return new Course(data.title, data.lessons)
}
}
const course = Course.fromJSON('{"title":"React","lessons":16}')
console.log(course)
console.log(course instanceof Course)class Character {
static create(name) {
return new this(name)
}
constructor(name) {
this.name = name
}
}
class Guide extends Character {}
console.log(Character.create('Astro'))
console.log(Guide.create('Ra'))La classe Guide a hérité de la méthode create(). Appelée comme Guide.create(), this équivaut à Guide, donc elle crée une instance de la bonne classe.
class Levels {
static thresholds = []
static {
for (let level = 1; level <= 5; level++) {
Levels.thresholds.push(level * level * 100)
}
}
}
console.log(Levels.thresholds)Compatibilité des navigateurs
#Largement disponible
Fonctionne dans tous les navigateurs modernes, y compris sur mobile. Vous pouvez l’utiliser sans crainte.
- Chrome
- Edge
- Firefox
- Safari
Bonnes pratiques
#- Si une méthode n’utilise aucune donnée de l’instance, demandez-vous si elle ne devrait pas être statique, ou simplement une fonction ordinaire hors de la classe.
- Dans le constructeur et les méthodes d’instance, référez-vous à un champ statique par le nom de la classe, par exemple
Student.count. L’écriturethis.countcherche un champ sur l’objet, pas sur la classe. - Transmettez avec prudence une méthode statique qui utilise
thiscomme callback. Détachée de la classe, elle perdthis, tout comme les méthodes ordinaires.
Entrées associées
#- classDéfinit une classe, c’est-à-dire un modèle pour créer des objets avec les mêmes champs et méthodes.
- extendsCrée une classe dérivée qui hérite des méthodes d’une autre classe et peut les étendre ou les redéfinir.
- superFait référence à la classe de base : appelle son constructeur ou sa version d’une méthode.
- #champLes champs et méthodes préfixés par # sont privés : seul le code à l’intérieur de la classe peut y accéder.
- thisMot-clé qui désigne l’objet sur lequel une fonction a été appelée.
Vous voyez une erreur ou il manque un exemple ? Écrivez-nous.