Puis-je utiliser des variables comme noms de propriétés d'objet en JavaScript ?

Comment définir dynamiquement les noms de propriétés d'objet en JavaScript

Les littéraux d'objet JavaScript sont pratiques pour définir une collection de paires clé-valeur, où les clés représentent les noms de propriétés et les valeurs représentent les valeurs de propriété. Cependant, une question courante se pose : peut-on utiliser une variable comme clé dans un objet littéral ?

La réponse à cette question dépend de la version de JavaScript. Dans ES5 et versions antérieures, l'utilisation d'une variable directement comme clé dans un littéral d'objet ne fonctionnera pas. Par exemple :

var thetop = 'top';
something.stop().animate({ thetop: 10 }, 10); // Doesn't work

En effet, dans ES5, les noms de propriétés d'objet doivent être placés entre guillemets doubles ou simples.

Solution pour ES5 et versions antérieures

Pour utiliser une variable comme clé dans ES5, vous devez créer un littéral d'objet et attribuer manuellement la valeur de la propriété en utilisant le nom de la variable comme propriété. key :

var aniArgs = {};
aniArgs[thetop] = 10; // Assign value to property using variable name as key
something.stop().animate(aniArgs, 10); // Pass the object literal to the animate method

Noms de propriétés calculés ES6

ES6 introduit le concept de ComputedPropertyName, qui permet l'utilisation de variables et d'expressions comme noms de propriétés dans des littéraux d'objet. Cette syntaxe ressemble à :

const obj = { [variableOrExpression]: value };

En utilisant cette syntaxe, vous pouvez définir dynamiquement des noms de propriétés à l'aide de variables, par exemple :

var thetop = 'top';
const obj = { [thetop]: 10 };
console.log(obj.top); // Prints 10

Cette syntaxe est prise en charge dans les navigateurs modernes et peut simplifier le processus de définition dynamique des noms de propriétés d'objet.

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!