在復雜的JavaScript物件中回圈出現問題

有這樣的物件

const countries = {
  iran: {
    capital : 'Tehran',
    population  : '83183741',
    area    : '1648195'
  },
  uk: {
    capital : 'London',
    population  : '6708100',
    area    : '242495'
  },
  us: {
    capital : 'Washington D.C.',
    population  : '332641717',
    area    : '9525067'
  },
  ukraine: {
    capital : 'Kyiv',
    population  : '44983019',
    area    : '603500'
  }
};

你能告訴我如何獲得這樣的輸出嗎

iran,capital,Tehran
iran,population,83183741
iran,area,1648195
uk,capital,Tehran
uk,population,6708100
uk,area,242495
....
ukrane,capital,603500
ukrane,population,41130432
ukrane,area,603500

const countries = {
  iran: {
    capital : 'Tehran',
    population  : '83183741',
    area    : '1648195'
   
  },
  uk: {
    capital : 'London',
    population  : '6708100',
    area    : '242495'
   
  },
  us: {
    capital : 'Washington D.C.',
    population  : '332641717',
    area    : '9525067'
   
  },
  ukrane: {
    capital : 'Kiev',
    population  : '41130432 ',
    area    : '603500'
   
  }
};
  

var i = 1;
for (const country in countries) {
  console.log(country);
  for (let x in country) {
    console.log(country[x])
}
  i  
}

uj5u.com熱心網友回復：

你很親密。您唯一錯過的是for..in回圈為您提供key，而不是 value。因此，您必須像這樣訪問物件上的給定鍵：

const countries = {
  iran: {
    capital : 'Tehran',
    population  : '83183741',
    area    : '1648195'
   
  },
  uk: {
    capital : 'London',
    population  : '6708100',
    area    : '242495'
   
  },
  us: {
    capital : 'Washington D.C.',
    population  : '332641717',
    area    : '9525067'
   
  },
  ukrane: {
    capital : 'Kiev',
    population  : '41130432 ',
    area    : '603500'
   
  }
};
  

for (const country in countries) {
  console.log(country);
  for (const property in countries[country]) {
    console.log(countries[country][property])
  }
}

從那里，您可以輕松地連接所需的資訊：

const countries = {
  iran: {
    capital : 'Tehran',
    population  : '83183741',
    area    : '1648195'
   
  },
  uk: {
    capital : 'London',
    population  : '6708100',
    area    : '242495'
   
  },
  us: {
    capital : 'Washington D.C.',
    population  : '332641717',
    area    : '9525067'
   
  },
  ukrane: {
    capital : 'Kiev',
    population  : '41130432 ',
    area    : '603500'
   
  }
};
  

for (const country in countries) {
  for (const property in countries[country]) {
    console.log(`${country},${property},${countries[country][property]}`)
  }
}

請注意，它for..in還會遍歷原型上的鍵，因此您應該進行額外檢查以避免這種情況。相反，我建議使用帶有or的for..of回圈：Object.keys()Object.entries()

顯示代碼片段

const countries = {
  iran: {
    capital : 'Tehran',
    population  : '83183741',
    area    : '1648195'
   
  },
  uk: {
    capital : 'London',
    population  : '6708100',
    area    : '242495'
   
  },
  us: {
    capital : 'Washington D.C.',
    population  : '332641717',
    area    : '9525067'
   
  },
  ukrane: {
    capital : 'Kiev',
    population  : '41130432 ',
    area    : '603500'
   
  }
};
  

for (const country of Object.keys(countries)) {
  for (const property of Object.keys(countries[country])) {
    console.log(`${country},${property},${countries[country][property]}`)
  }
}

uj5u.com熱心網友回復：

這可以是基本方式：

//here we loop to get the countries
for (let country in countries) {
    // this will be the index (iran , uk , us , ukrane)
    
    //here we loop into the data of each country
    for(let data in countries[country]){
        //and we print the result easy as this:
        console.log(country   " , "   data   " , "  countries[country][data]);
    }

}

uj5u.com熱心網友回復：

這將是另一種方式，使用Object.keys和 a forEach。

const countries = {
  iran: {
    capital: 'Tehran',
    population: '83183741',
    area: '1648195'
  },
  uk: {
    capital: 'London',
    population: '6708100',
    area: '242495'
  },
  us: {
    capital: 'Washington D.C.',
    population: '332641717',
    area: '9525067'
  },
  ukrane: {
    capital: 'Kiev',
    population: '41130432 ',
    area: '603500'
  }
};

Object.keys(countries)
  .forEach(x =>
    console.log(`${x},${countries[x].capital},${countries[x].population},${countries[x].area}`)
  )

uj5u.com熱心網友回復：

也許是這樣？

const countries = 
  { iran:    { capital: 'Tehran',          population: '83183741',  area: '1648195' } 
  , uk:      { capital: 'London',          population: '6708100',   area: '242495'  } 
  , us:      { capital: 'Washington D.C.', population: '332641717', area: '9525067' } 
  , ukraine: { capital: 'Kyiv',            population: '44983019',  area: '603500'  }  
  };

Object.keys(countries).forEach( cName =>
Object.entries(countries[cName]).forEach( ([k,v]) =>
  console.log( `${cName},${k},${v}`)
))

.as-console-wrapper {max-height: 100% !important;top: 0;}
.as-console-row::after {display: none !important;}

標籤：javascript

上一篇：在應用程式腳本中合并從API回傳的陣列JSON

下一篇：根據選擇顯示或隱藏div