| [ Web Proxy ] |
| Viewing: https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Classes/Public_class_fields | [Back] [Original] |
Get to know MDN better
Cette page a t traduite partir de l'anglais par la communaut. Vous pouvez contribuer en rejoignant la communaut francophone sur MDN Web Docs.
Cette fonctionnalit est bien tablie et fonctionne sur de nombreux appareils et versions de navigateurs. Elle est disponible sur tous les navigateurs depuis septembre 2022.
Exprimental: Il s'agit d'une technologie exprimentale.
Vrifiez attentivement le tableau de compatibilit des navigateurs avant de l'utiliser en production.
Note : Cette page dcrit des fonctionnalits exprimentales.
Les dclarations de champs, tant publics que privs, sont une fonctionnalit exprimentale (tape 3) propose au TC39, le comit des standards JavaScript.
La prise en charge dans les navigateurs est limite, mais cette fonctionnalit peut tre utilise travers une tape de contruction avec des systmes tels que Babel. Voir l'information de compatibilit ci-dessous.
Les champs publics, tant statiques que d'instance, sont des proprits qui peuvent tre crites, et qui sont numrables et configurables. En tant que telles, la diffrence de leurs contreparties prives, elles participent l'hritage du prototype.
class ClasseAvecChampDInstance {
champDInstance = "champ d'instance";
}
class ClasseAvecChampStatique {
static champStatique = "champ statique";
}
class ClasseAvecMethodeDInstancePublique {
methodePublique() {
return "hello world";
}
}
Les champs statiques publics sont utiles lorsque vous voulez qu'un champ n'existe qu'une seule fois par classe, pas dans chaque instance que vous crez. Cela est utile pour des caches, une configuration fixe, ou tout autres donnes dont vous n'avez pas besoin qu'elles soient rpliques travers les instances.
Les champs statiques publics sont dclars en utilisant le mot-cl static. Ils sont ajouts au constructeur de la classe au moment de l'valuation de la classe en utilisant Object.defineProperty(). On y accde nouveau partir du constructeur de la classe.
class ClasseAvecChampStatique {
static champStatique = "champ statique";
}
console.log(ClasseAvecChampStatique.champStatique);
// affichage attendu : "champ statique"
Les champs sans initialiseur sont initialiss undefined.
class ClasseAvecChampStatique {
static champStatique;
}
console.assert(ClasseAvecChampStatique.hasOwnProperty("champStatique"));
console.log(ClasseAvecChampStatique.champStatique);
// affichage attendu : "undefined"
Les champs statiques publics ne sont pas rinitialiss dans les sous-classes, mais on peut y accder via la chane de prototypes.
class ClasseAvecChampStatique {
static champStatiqueDeBase = "champ de base";
}
class SousClasseAvecChampStatique extends ClasseAvecChampStatique {
static sousChampStatique = "champ de la sous-classe";
}
console.log(SousClasseAvecChampStatique.sousChampStatique);
// affichage attendu : "champ de la sous-classe"
console.log(SousClasseAvecChampStatique.champStatiqueDeBase);
// affichage attendu : "champ de base"
Lors de l'initialisation des champs, this fait rfrence au constructeur de la classe. Vous pouvez aussi le rfrencer par son nom, et utiliser super pour obtenir le constructeur de la superclasse (s'il en existe un) :
class ClasseAvecChampStatique {
static champStatiqueDeBase = "champ statique de base";
static autreChampStatiqueDeBase = this.champStatiqueDeBase;
static methodeStatiqueDeBase() {
return "affichage de la mthode statique de base";
}
}
class SousClasseAvecChampStatique extends ClasseAvecChampStatique {
static sousChampStatique = super.methodeStatiqueDeBase();
}
console.log(ClasseAvecChampStatique.autreChampStatiqueDeBase);
// affichage attendu : "champ statique de base"
console.log(SousClasseAvecChampStatique.sousChampStatique);
// affichage attendu : "affichage de la mthode statique de base"
Les champs d'instance publics existent dans chaque instance cre d'une classe. En dclarant un champ public, vous pouvez vous assurer que le champ est toujours prsent, et que la dfinition de la classe est davantage auto-documente.
Les champs d'instance publics sont ajouts grce Object.defineProperty(), soit au moment de la construction dans la classe de base (avant que le corps du constructeur ne soit excut), soit juste aprs le retour de super() dans une sous-classe.
class ClasseAvecChampDInstance {
champDInstance = "champ d'instance";
}
const instance = new ClasseAvecChampDInstance();
console.log(instance.champDInstance);
// affichage attendu : "champ d'instance"
Les champs sans initialiseur sont initialiss undefined.
class ClasseAvecChampDInstance {
champdDInstance;
}
const instance = new ClasseAvecChampDInstance();
console.assert(instance.hasOwnProperty("champDInstance"));
console.log(instance.champDInstance);
// affichage attendu : "undefined"
l'instar des proprits, les noms de champ peuvent tre calculs :
const PREFIXE = "prefixe";
class ClasseAvecNomDeChampCalcule {
[`${PREFIXE}Champ`] = "champ prfix";
}
const instance = new ClasseAvecNomDeChampCalcule();
console.log(instance.prefixeChamp);
// affichage attendu : "champ prfix"
Lors de l'initialisation des champs, this fait rfrence l'instance en cours de construction. Tout comme dans les mthodes d'instance publiques, si vous tes dans une sous-classe, vous pouvez accder au prototype de la superclasse en utilisant super.
class ClasseAvecChampDInstance {
champDInstanceDeBase = "champ de base";
autreChampDInstanceDeBase = this.champDInstanceDeBase;
methodeDInstanceDeBase() {
return "affichage de la mthode de base";
}
}
class SousClasseAvecChampDInstance extends ClasseAvecChampDInstance {
sousChampDInstance = super.methodeDInstanceDeBase();
}
const base = new ClasseAvecChampDInstance();
const sous = new SousClasseAvecChampDInstance();
console.log(base.autreChampDInstanceDeBase);
// affichage attendu : "champ de base"
console.log(sous.sousChampDInstance);
// affichage attendu : "affichage de la mthode de base"
Le mot-cl static dfinit une mthode statique pour une classe. Les mthodes statiques ne sont pas appeles dans les instances de la classe. A la place, elles le sont dans la classe elle-mme. Ce sont souvent des mthodes utilitaires, comme des fonctions pour crer ou cloner des objets.
class ClasseAvecMethodeStatique {
static methodeStatique() {
return "la mthode statique a t appele.";
}
}
console.log(ClasseAvecMethodeStatique.methodeStatique());
// affichage attendu : "la mthode statique a t appele."
Les mthodes statiques sont ajoutes au constructeur de la classe grce Object.defineProperty() au moment de l'valuation de la classe. Ces mthodes peuvent tre crites, ne sont pas numrables et sont configurables.
Comme leur nom l'implique, les mthodes d'instance publiques sont des fonctions disponibles dans les instances de la classe.
class ClasseAvecMethodeDInstancePublique {
methodePublique() {
return "hello world";
}
}
const instance = new ClasseAvecMethodeDInstancePublique();
console.log(instance.methodePublique());
// affichage attendu : "hello world"
Les mthodes d'instance publiques sont ajoutes au prototype au moment de l'valuation de la classe en utilisant Object.defineProperty(). Elles peuvent tre crites, ne sont pas numrables et sont configurables.
Vous pouvez utiliser des fonctions gnratrices, asynchrones et gnratrices asynchrones.
class ClasseAvecMethodesFantaisie {
*methodeGeneratrice() {}
async methodeAsynchrone() {}
async *methodeGeneratriceAsynchrone() {}
}
A l'intrieur des mthodes d'instance, this fait rfrence l'instance elle-mme. Dans les sous-classes, super vous donne accs au prototype de la superclasse, ce qui vous permet d'appeler les mthodes de la superclasse.
class ClasseDeBase {
msg = "hello world";
methodePubliqueDeBase() {
return this.msg;
}
}
class SousClasse extends ClasseDeBase {
sousMethodePublique() {
return super.methodePubliqueDeBase();
}
}
const instance = new SousClasse();
console.log(instance.sousMethodePublique());
// affichage attendu : "hello world"
Les accesseurs et les mutateurs sont des mthodes spciales qui sont lies une proprit de classe, et sont appeles lorsqu'on accde cette proprit ou qu'on la dfinit. Utilisez la syntaxe get et set pour dclarer un accesseur ou un mutateur publique d'une instance.
class ClasseAvecGetSet {
#msg = "hello world";
get msg() {
return this.#msg;
}
set msg(x) {
this.#msg = `hello ${x}`;
}
}
const instance = new ClasseAvecGetSet();
console.log(instance.msg);
// affichage attendu : "hello world"
instance.msg = "gteau";
console.log(instance.msg);
// affichage attendu : "hello gteau"
| Spcification |
|---|
| ECMAScript 2027 LanguageSpecification # prod-FieldDefinition |
Cette page a t modifie le 22 mai 2026 par les contributeurices du MDN.
Certaines parties de ce contenu sont protges par le droit d'auteur 19982026 des contributeurs individuels de mozilla.org. Contenu disponible sous une licence Creative Commons.
| Web Proxy Viewer | New URL | Original Page |