Maison  >  Article  >  interface Web  >  Comment réaliser une attribution dynamique de propriétés dans des objets JavaScript ?

Comment réaliser une attribution dynamique de propriétés dans des objets JavaScript ?

Mary-Kate Olsen
Mary-Kate Olsenoriginal
2024-10-21 10:09:02189parcourir

How to Achieve Dynamic Property Assignment in JavaScript Objects?

Affectation dynamique des clés dans les littéraux d'objet

En JavaScript, les crochets ([) ne sont pas seulement utilisés pour spécifier des indices de tableau, mais également à l'intérieur d'un objet des littéraux pour créer des noms de propriétés calculés. Cela nous permet de générer dynamiquement les clés d'un objet en fonction d'expressions ou de variables.

Exemple :

Considérons le code suivant :

<code class="js">let a = "b";
let c = { [a]: "d" };
console.log(c); // Object { b: "d" }</code>

Dans cet exemple, les crochets autour de [a] permettent d'utiliser la valeur de la variable a comme clé de la propriété de l'objet. On se retrouve avec un objet avec une clé de b et une valeur de d.

Comment ça marche :

Cette syntaxe est introduite avec ES2015 (ES6) et est connue sous le nom de syntaxe de nom de propriété calculée. Il fournit un raccourci pour l'affectation suivante :

<code class="js">var a = "b";
var c = {};
c[a] = "d";</code>

Avec les noms de propriétés calculés, au lieu d'utiliser la notation par points (par exemple, c.a) ou la notation par crochets (par exemple, c["a"]) pour la clé dynamique affectation, nous pouvons simplement utiliser la variable ou l'expression entre crochets.

Avantages :

Les noms de propriétés calculés offrent une flexibilité dans la création d'objets, en particulier lorsque vous travaillez avec des propriétés dynamiques ou structures de données complexes. Ils nous permettent de générer facilement des clés d'objet basées sur des calculs, des entrées utilisateur ou une autre logique programmatique.

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn