Maison >interface Web >js tutoriel >Mutabilité des objets en Javascript
La mutabilité est la capacité de modifier une valeur. Une valeur mutable peut être modifiée et une valeur immuable ne peut pas être modifiée. Une idée fausse courante est que le mot-clé « const » rend une variable immuable.
En réalité, "const" empêche uniquement la réaffectation. Pour les types non-objets, les valeurs ne peuvent être modifiées que par réaffectation, donc les déclarer avec "const" les rend en fait immuables. Considérons, par exemple, le code suivant :
const num = 5; num = 7; // illegal reassignment of const variable
Il n'y a aucun moyen de changer la valeur de num dans ce code. Notez que l'utilisation de ++ ou -- sont toujours considérées comme des réaffectations, et cela est indiqué dans le message d'erreur si on essaie de les utiliser sur une variable déclarée avec const.
const num = 5; num++;//illegal reassignment of constant
L'erreur résultante est :
Uncaught TypeError: Assignment to constant variable.
Les objets sont fondamentalement différents en ce qui concerne la mutabilité dans la mesure où leurs valeurs peuvent changer sans réaffectation de la variable. Notez que la réaffectation des propriétés n'est pas empêchée par "const". Seul le nom de la variable ne peut pas être réaffecté.
const obj = {num: 5}; obj.num = 7; //legal obj = {num: 7}; //illegal reassignment
Les objets peuvent également avoir des méthodes qui modifient les valeurs internes.
const obj = { num: 5, increment(){ this.num++; } } obj.increment(); console.log(obj.num); //6
Il est possible de rendre un objet réellement immuable en le déclarant avec "const" et en utilisant Object.freeze().
const obj = {num: 5}; Object.freeze(obj); obj.num = 7; // doesn't change console.log(obj.num);// still 5
Notez que si nous utilisons le mode strict, la tentative de modification de la valeur num provoquerait en fait un crash avec le message d'erreur suivant :
Cannot assign to read only property 'num'
L'utilisation de Object.freeze() sans "const" est déjà suffisante pour rendre cet objet immuable. Cependant, cela ne rend pas le nom de la variable immuable.
let obj = {num: 5}; Object.freeze(obj); obj = {num: 5}; // new object with old name obj.num = 7; // changes successfully console.log(obj.num);// 7
Ce qui se passe dans cette version du code, c'est que obj est réaffecté. Le freeze() a été appliqué à l'objet précédent qui partageait le même nom, mais le nouvel objet n'a jamais été gelé, il est donc mutable.
Il peut arriver que vous souhaitiez autoriser la modification des valeurs d'un objet, mais vous ne souhaitez pas autoriser l'ajout ou la suppression de propriétés. Ceci peut être réalisé en utilisant Object.seal().
let obj = {num: 5}; Object.seal(obj); obj.num = 7; // changes console.log(obj.num);// 7 obj.newValue = 42; //cannot add new property to sealed object console.log(obj.newValue);//undefined delete obj.num; //cannot delete property from sealed object console.log(obj.num);// still exists and is 7
La congélation et le scellage s'appliquent à l'ensemble de l'objet. Si vous souhaitez rendre des propriétés spécifiques immuables, cela peut être fait en utilisant définirProperty() ou définirProperties(). Le choix entre ces deux dépend si vous souhaitez affecter une seule propriété ou plusieurs propriétés.
const obj = {}; Object.defineProperty(obj, 'num',{ value: 5, writable: false, configurable: false }); obj.num = 7; // Cannot change value because writable is false delete obj.num; // Cannot delete because configurable is false console.log(obj.num);//Still exists and is 5
Une nouvelle propriété est définie dans cet exemple, mais finishProperty() peut également être utilisée sur une propriété existante. Notez que si « configurable » était précédemment défini sur false, il ne peut pas être modifié en true, mais s'il était initialement vrai, il peut être défini sur false, puisque ce changement compte comme un type de configuration.
Dans la plupart des cas, vous n'aurez pas besoin de garantir qu'un objet est immuable. Lorsqu'un tel besoin s'en fait sentir, il suffit généralement de figer l'objet, mais nous disposons d'options supplémentaires pour des contrôles plus fins si de tels besoins s'en font sentir.
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!