J'ai une structure de données imbriquée contenant des objets et des tableaux. Comment extraire des informations, c'est-à-dire accéder à des valeurs (ou clés) spécifiques ou multiples ?
Par exemple :
var data = { code: 42, items: [{ id: 1, name: 'foo' }, { id: 2, name: 'bar' }] };
Comment accéderitems
中第二项的name
?
Vous pouvez y accéder de cette façon
ou
Les deux méthodes sont égales.
Connaissances préliminaires
JavaScript n'a qu'un seul type de données pouvant contenir plusieurs valeurs : Object. Array est une forme spéciale d'objet.
Les objets (normaux) ont la forme suivante
La forme du tableau est
Les tableaux et les objets exposent tous deux une structure
key -> value
. Les clés des tableaux doivent être des nombres, tandis que n'importe quelle chaîne peut être utilisée comme clé dans un objet. Les paires clé-valeur sont également appelées "propriétés".Les propriétés sont accessibles en utilisant la notation par points
ou notation entre crochets, si le nom de la propriété n'est pas un nom d'identifiant JavaScript valide[spec], ou si le nom est la valeur d'une variable :
Par conséquent, les éléments du tableau ne sont accessibles qu'en utilisant la notation entre crochets :
Attendez... et JSON ?
JSON est une représentation textuelle de données, tout comme XML, YAML, CSV, etc. Pour traiter de telles données, vous devez d'abord les convertir en types de données JavaScript, à savoir des tableaux et des objets (comment traiter ces données vient d'être expliqué). Question Analyser JSON en JavaScript ? Comment analyser JSON est expliqué dans .
Autres lectures
Comment accéder aux tableaux et aux objets est une base de JavaScript, il est donc recommandé de lire le Guide JavaScript MDN, en particulier les différentes sections
Accéder aux structures de données imbriquées
Une structure de données imbriquée est un tableau ou un objet qui fait référence à d'autres tableaux ou objets, c'est-à-dire que sa valeur est un tableau ou un objet. De telles structures sont accessibles par application successive de notation par points ou parenthèses.
Voici un exemple :
Supposons que nous souhaitions accéder au deuxième élément
名称
.Voici comment nous procédons étape par étape :
Comme nous pouvons le voir, les
data
是一个对象,因此我们可以使用点表示法访问其属性。items
propriétés sont accessibles comme suit :La valeur est un tableau et pour accéder à son deuxième élément nous devons utiliser la notation entre crochets :
Cette valeur est un objet, et encore une fois nous utilisons la notation par points pour accéder aux propriétés
name
. On se retrouve donc avec :Alternativement, nous pouvons utiliser la notation entre crochets pour n'importe quel attribut, surtout si le nom contient des caractères qui le rendent invalide pour la notation par points :
J'essaie d'accéder à une propriété mais je ne reçois que
undefined
des informations ?La plupart du temps, lorsque vous rencontrez
未定义
, l'objet/le tableau n'a tout simplement pas de propriété portant ce nom.Utilisez
console.log
或console.dir
et vérifiez la structure de l'objet/du tableau. Il est possible que la propriété à laquelle vous essayez d'accéder soit réellement définie sur un objet/tableau imbriqué.Et si les noms de propriétés sont dynamiques et que je ne les connais pas à l'avance ?
Si le nom de la propriété est inconnu ou si nous voulons accéder à toutes les propriétés de l'élément objet/tableau, nous pouvons utiliser
for...in
[MDN] 循环对象和for
[MDN] tableau de boucles pour parcourir toutes les propriétés/éléments.objet
Pour parcourir toutes les propriétés de
data
, nous pouvons parcourir l'objet comme suit :En fonction de la provenance de l'objet (et de ce que vous souhaitez faire), vous devrez peut-être tester à chaque itération si la propriété est bien une propriété de l'objet, ou une propriété héritée. Vous pouvez utiliser
Object#hasOwnProperty代码> [MDN]
.Comme alternative à
tableau de noms d'attributfor...in
和hasOwnProperty
的替代方案,您可以使用Object.keys
for...in et hasOwnProperty, vous pouvez utiliser Object.keys [MDN] Obtenez:
tableau
Pour parcourir tous les éléments dudata.items
数组 的所有元素,我们使用for
data.items
for...in
array, nous utilisons une boucle for :