Explication détaillée du code sur la façon dont javascript parcourt les valeurs d'attribut d'un objet

Concernant la nécessité de "traverser les propriétés et les valeurs des objets en js". La raison est de créer un plug-in js qui actualise partiellement le contenu de la table.

Problème : Impossible d'obtenir la valeur d'attribut de l'objet en parcourant le tableau de noms d'attribut

Le code d'erreur initial est le suivant :

for(var i=0;i<dataList.length;i++)
{
  var dataLine="<tr>";   
  for(var j=0;j<filedList.length;j++){
    dataLine+="<td>"+dataList[i].filedList[j]+"</td>"; 
  } 
  dataLine+="</tr>";
  $("#"+tableName).append(dataLine);
}

Tout d'abord, dataList contient un tableau d'objets ; fieldList contient un tableau de noms de champs d'attributs d'objets. Au début, je pensais comme ça, parcourir la dataList et obtenir un objet à chaque fois, puis imbriquer une boucle for, parcourir la fieldList, obtenir une de ses valeurs d'attribut à chaque fois, puis la rassembler dans un tableau .

Par exemple : dataList[0] est un objet Emp et Emp a des attributs tels que l'identifiant et le nom. Normalement, nous pouvons obtenir la valeur d'identification de l'objet Emp actuel via dataList[0].id. Mais si vous parcourez le tableau de champs attributaires, vous ne pouvez pas utiliser dataList[0].filedList[0] de cette manière. Cela ne signifie pas que la valeur n'est pas obtenue dans fieldList[0], car j'ai déjà obtenu la valeur id de 1 via alert(filedList[0]). Alors pourquoi l’acquisition échoue-t-elle ? Parce qu'il recherche une propriété appelée fieldList[0] dans l'objet Emp ! Bien sûr, il n'y a pas un tel attribut dans l'objet Emp, donc l'acquisition échoue comme elle le devrait. Alors, comment pouvons-nous obtenir la valeur d'attribut de l'objet ?

Solution : utilisez la "boucle for améliorée" pour parcourir

Le code correct est le suivant :

for(var i=0;i<dataList.length;i++)
{
  var dataLine="<tr>";   
  for(var filedName in dataList[i]){
    dataLine+="<td>"+dataList[i][filedName]+"</td>"; 
  } 
  dataLine+="</tr>";
  $("#"+tableName).append(dataLine);
}

Idée de solution : Puisque dataList[i] est un objet, je peux obtenir le nom d'attribut de cet objet à chaque fois, puis obtenir la valeur d'attribut de cet attribut via dataList[i][filedName], c'est-à-dire l'objet [nom d'attribut] .

function displayProp(obj){  
  var names="";    
  for(var name in obj){    
    names+=name+": "+obj[name]+", "; 
  } 
  alert(names); 
}

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!