Comment créer des clés dynamiques dans des objets JavaScript ?

Création de clés dynamiques dans des objets JavaScript

Dans le but d'ajouter dynamiquement des clés à un objet, l'approche suivante peut ne pas obtenir le résultat souhaité :

jsObj = {};

for (let i = 1; i <= 10; i++) {
    jsObj{'key' + i} = 'example ' + 1;
}

Pour créer des clés dynamiques, la notation entre crochets doit être utilisée dans la boucle :

jsObj['key' + i] = 'example ' + 1;

Comprendre les propriétés des objets et le comportement des tableaux

Les objets JavaScript peuvent avoir des noms de propriété qui sont des chaînes numériques (par exemple, "0", "5", "207"). Cependant, le comportement des instances de tableau diffère considérablement :

• Les tableaux conservent une propriété de longueur indiquant le nombre de noms de propriétés numériques plus un.
• La définition de la propriété de longueur supprime les noms de propriétés numériques.

La définition de la propriété de longueur supprime les noms de propriétés numériques.

Ce comportement n'a aucun impact sur le fonctionnement de l'opérateur crochet, qui permet d'accéder et de modifier les propriétés des objets.

Définition des propriétés avec des noms numériques

Lors de la définition de propriétés avec des noms numériques à l'aide de la notation entre crochets, ce qui suit se produit :
• Dans une instance de tableau, la propriété length est mise à jour si le nom numérique est le plus grand existant.

Dans un objet simple, aucun effet secondaire de ce type ne se produit.

Par conséquent, l'utilisation de tableaux pour stocker des propriétés numériques peut être bénéfique lorsque le maintien de la propriété de longueur est souhaité.

Considérations sur la sérialisation JSON

Lorsque vous travaillez avec la sérialisation JSON, il est important de savoir que seules les propriétés des tableaux nommées numériquement sont incluses dans le formulaire sérialisé. Toutes les autres propriétés ajoutées seront perdues.

Noms de propriétés calculés ES2015

let key = 'DYNAMIC_KEY',
    obj = {
        [key]: 'ES6!'
    };

console.log(obj);
// { 'DYNAMIC_KEY': 'ES6!' }

Dans ES6 JavaScript, les noms de propriétés calculés peuvent être facilement utilisés pour gérer les clés dynamiques :

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!