Maison > interface Web > js tutoriel > Comment attribuer dynamiquement des clés d'objet en JavaScript à l'aide de variables ?

Comment attribuer dynamiquement des clés d'objet en JavaScript à l'aide de variables ?

Barbara Streisand
Libérer: 2024-12-18 11:03:11
original
943 Les gens l'ont consulté

How to Dynamically Assign Object Keys in JavaScript Using Variables?

Attribution de clés d'objet JavaScript à l'aide de variables

Lors de la création d'objets JavaScript et de leur stockage dans un tableau, vous pouvez rencontrer un problème où la clé d'objet est défini sur "key" au lieu de la valeur souhaitée attribuée à une variable. Cet article fournit une solution à ce problème en expliquant comment utiliser des variables pour définir dynamiquement les clés d'objet.

L'approche par défaut utilisant le . la notation ne permet pas l'affectation dynamique des touches :

var key = "happyCount";
myArray.push({ key: someValueArray });
Copier après la connexion

Pour y parvenir, modifiez le code :

var key = "happyCount";
var obj = {};

obj[key] = someValueArray;
myArray.push(obj);
Copier après la connexion

Ce code crée d'abord un objet vide, obj. Ensuite, en utilisant la notation entre crochets, vous attribuez la variable key comme clé et someValueArray comme valeur. Cela permet l'attribution dynamique de touches à partir d'une variable.

Noms de propriétés calculés ES6

ECMAScript 2015 (ES6) a introduit les noms de propriétés calculés, qui offrent une syntaxe plus concise :

const yourKeyVariable = "happyCount";
const someValueArray= [...];

const obj = {
    [yourKeyVariable]: someValueArray,
}
Copier après la connexion

Ce code utilise des crochets dans la notation littérale de l'objet pour calculer dynamiquement le nom de la propriété de l'objet à partir de le yourKeyVariable.

Cette solution offre un moyen flexible d'attribuer des clés d'objet à l'aide de variables, vous permettant de remplir dynamiquement des objets avec des clés variables.

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!

source:php.cn
Déclaration de ce site Web
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
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal