Comment accéder aux propriétés d'un objet JavaScript avec des traits d'union ?

Comprendre l'accès aux propriétés dans les objets JavaScript avec des traits d'union

Dans le développement Web, l'accès aux propriétés des objets est crucial. Cependant, les propriétés comportant des tirets, telles que les propriétés de style CSS, présentent des défis. Pour résoudre ce problème, il est essentiel de comprendre les limites de la notation par points et d'utiliser des méthodes alternatives.

Limitations de la notation par points

Comme vous l'avez rencontré, l'accès aux propriétés avec des traits d'union à l'aide la notation par points (par exemple, style.text-align) entraîne des erreurs car le trait d'union est interprété comme un signe moins. Pour surmonter cela, la notation clé doit être utilisée.

Notation clé

La notation clé implique l'utilisation de crochets ([]) pour accéder aux propriétés de l'objet. Pour les propriétés avec des traits d'union, la syntaxe suivante est requise :

obj["key-with-hyphen"]

En l'appliquant à votre code, vous pouvez récupérer la propriété "text-align" comme suit :

style["text-align"]

Considérations supplémentaires

Lorsque vous accédez aux propriétés à l'aide de la notation clé, conservez les éléments suivants mind :

• Utiliser des littéraux de chaîne : Les clés de propriété avec des traits d'union doivent être entourées de littéraux de chaîne car elles sont évaluées dynamiquement.
• Tableaux en tant qu'objets : Les tableaux en JavaScript sont des objets et les propriétés des objets sont accessibles en utilisant le même syntaxe.
• Regex pour les noms de propriétés valides : L'expression régulière suivante garantit que les noms de propriétés sont conformes aux conventions de dénomination JavaScript :

[a-zA-Z_$][0-9a-zA-Z_$]*

En incorporant ces concepts , vous pouvez accéder efficacement aux propriétés des objets JavaScript avec des traits d'union, ce qui vous permet de manipuler facilement les styles CSS et d'autres objets.

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!