Champs et méthodes de classe

Les champs de classe sont déclarés directement dans le corps d'une classe, et non explicitement. ajoutée en tant que propriété de la valeur this. Cependant, le résultat est le même : définie sur les instances de cette classe.

class MyClass {
    myField;
}

const myClassInstance = new MyClass();

myClassInstance;
> MyClass { myField: undefined }

Vous pouvez initialiser un champ avec une valeur. Il s'agit souvent d'une valeur par défaut de la classe peut écraser:

class MyClass {
    myResult = false;
    set setValue( myValue ) {
        this.myResult = myValue;
    }
}
const myClassInstance = new MyClass();

myClassInstance;
> Object { myResult: false }

myClassInstance.setValue = true;

myClassInstance;\
> Object { myResult: true }

Les champs de classe sont fonctionnellement identiques aux propriétés associées à la classe. avec this. Autrement dit, il est possible d'y accéder et de les modifier depuis l'extérieur comme n'importe quelle autre propriété.

class MyClass {
    myField = true;
}

const myClassInstance = new MyClass();

myClassInstance.myField;
> true

myClassInstance.myField = false;

myClassInstance.myField;
> false;

Les champs constituent une base pour certaines fonctionnalités plus avancées des classes.

Champs et méthodes privés

Les champs et les méthodes privés sont inaccessibles en dehors d'une classe. Une vue privée est associée à une instance d'une classe, ce qui signifie que chaque instance contient son propre ensemble de champs et de méthodes privés, tels que définis dans la classe.

Pour rendre une propriété privée, ajoutez un # au début de l'identifiant lorsque vous la déclarez:

class MyClass {
    #myPrivateField = true;
    #myPrivateMethod() {}
}
const myClassInstance = new MyClass();

myClassInstance;
> MyClass { #myPrivateField: true }
    #myPrivateField: true
    <prototype>: Object {  }
        constructor: class MyClass {}
        <prototype>: Object {  }

Un champ privé doit être déclaré dans le corps de la classe associée. Vous pouvez modifier sa valeur par la suite en tant que propriété de this, mais vous ne pouvez pas créer le champ ; avec this.

Les champs privés ne sont pas accessibles depuis un autre emplacement d'un script. Cela empêche les données les propriétés d'être modifiées en dehors des méthodes getter et setter fournies. avec les valeurs qu'ils contiennent et empêche l'accès direct destinées à être utilisées uniquement dans la classe elle-même.

class MyClass {
    #myResult = false;
    set setValue( myValue ) {
        this.#myResult = myValue;
    }
}
const myClassInstance = new MyClass();

myClassInstance;
> MyClass { #myResult: false }

myClassInstance.#myResult = true;
> Uncaught SyntaxError: reference to undeclared private field or method #myResult

myClassInstance.setValue = true;

myClassInstance;\
> MyClass { #myResult: true }

Toutefois, n'oubliez pas que les consoles de développement sont généralement très permissives, bien qu'incohérents, sur l'autorisation d'accès à des champs privés pour le débogage finalités:

class MyClass {
    #myPrivateField = true;
    #myPrivateMethod() {
        console.log( "This is inside a private method." );
    }
}
const myClassInstance = new MyClass();

myClassInstance;
> MyClass {#myPrivateField: true}

myClassInstance.#myPrivateField;
> true

myClassInstance.#myPrivateMethod();
> "This is inside a private method."
class MyClass {
    #myPrivateField = true;
    #myPrivateMethod() {
        console.log( "This is inside a private method." );
    }
}
const myClassInstance = new MyClass();

myClassInstance;
> MyClass {#myPrivateField: true}

myClassInstance.#myPrivateField;
> Uncaught SyntaxError: reference to undeclared private field or method #myPrivateField

myClassInstance.#myPrivateMethod();
> Uncaught SyntaxError: reference to undeclared private field or method #myPrivateMethod

Les champs privés sont étroitement limités au corps de la classe qui les contient, ce qui signifie que même les classes enfants ne peuvent pas accéder aux champs privés associés à un classe parente:

class MyClass {
    #myPrivateField = true;
}
class ChildClass extends MyClass {
    childMethod() {
        console.log( this.#myPrivateField );
    }
}
> Uncaught SyntaxError: reference to undeclared private field or method #myPrivateField

Champs et méthodes statiques

Les champs et méthodes statiques sont membres d'une classe elle-même, et non de membres de instances de cette classe. De ce fait, les champs statiques fournissent une pour les données qui ne sont pas uniques à chaque instance d'une classe, mais que ces instances instances qui devront peut-être faire référence, par exemple, à des informations de configuration partagées. Les méthodes statiques sont souvent des fonctions utilitaires permettant de travailler avec les instances d'une , telle que la comparaison ou le tri des instances par rapport à un champ qu'elles contiennent.

Pour définir des champs et des méthodes statiques dans le corps d'une classe, utilisez static. mot clé:

class MyClass {
    static myStaticField;
    static myStaticMethod() {}
}
const myClassInstance = new MyClass();

Vous pouvez également utiliser la notation par points pour créer une méthode statique:

class MyClass {
    constructor() {}
}
MyClass.myStaticMethod = function() {}

Vous ne pouvez pas accéder aux propriétés statiques à partir d'une instance de leur classe, disponible sur le constructeur de classe:

class MyClass {
    static myStaticField = true;
    static myStaticMethod() {
        console.log( "A static method." );
    }
}
const myClassInstance = new MyClass();

myClassInstance.myStaticField;
> undefined

myClassInstance.myStaticMethod();
> Uncaught TypeError: myClassInstance.myStaticMethod is not a function

MyClass.myStaticField;
> true

MyClass.myStaticMethod();
> "A static method."

Elles ne sont pas techniquement requises, mais l'utilisation de méthodes statiques est une bonne pratique pour créer des utilitaires pour travailler avec les instances d'une classe. Voici quelques exemples : incluent une méthode statique dédiée au tri des instances d'une classe, ou une méthode statique qui contient toute configuration nécessaire à la création d'une instance de puis renvoie l'instance de classe:

class User {
    constructor( name, email ) {
        this.name = name;
        this.email = email;
    }
    static fromObject( myObject ) {
        return new User( myObject.name, myObject.email ?? "Omitted" );
    }
}
const userObject = {
    "name" : "My Name",
    "email" : "my@email.address"
};
const secondUserObject = {
    "name" : "My Name"
};

const firstUser = User.fromObject( userObject );
const secondUser = User.fromObject( secondUserObject );

firstUser;
> Object { name: "My Name", email: "my@email.address" }

secondUser;
> Object { name: "My Name", email: "Omitted" }

Testez vos connaissances

Parmi les types de champs suivants, lesquels ne sont accessibles à l'intérieur de la classe ?

Champs de classe
Static fields
Champs privés