我正在做一个项目，使用电影数据库API和我有点混淆显示以下对象:
(3) [{…}, {…}, {…}]
0: {id: 12, name: "Adventure"}
1: {id: 28, name: "Action"}
2: {id: 878, name: "Science Fiction"}
length: 3
__proto__: Array(0)
基本上，我试图弄清楚如何在一个元素中显示这3个流派。 这样做forEach循环:
const genreArr = data.genres;
console.log(genreArr)
genreArr.forEach(function(item){
genre.textContent = item.name;
})
只显示一个流派名称，而不显示所有流派名称。 那么，我要做什么才能在一个段落中显示所有这些内容呢？
你可以做这样的事
let arr = [];
let sentence = '';
genreArr.forEach(el => {
arr.push(el.name);
sentence += ' ' + el.name;
})
console.log(arr)
console.log(sentence)
您可以使用地图并轻松地进行操作
null
const arraryList = [{id: 12, name: "Adventure"},
{id: 28, name: "Action"},
{id: 878, name: "Science Fiction"}];
const output = arraryList.map(val => val.name);
const combinedName = output.join(",");
console.log(output);
console.log(combinedName);
这一行genre.textContent=item.name；将覆盖textContent的每次迭代，只保留最后一个值。
您需要使用+=追加到TextContent。
null
const genreArr = [
{id: 12, name: "Adventure"},
{id: 28, name: "Action"},
{id: 878, name: "Science Fiction"}
];
const genre = document.getElementById('genre');
genreArr.forEach(function(item){
genre.textContent += item.name + ' | ';
})<div id="genre">
</div>