用于循环返回[object Object]

Question

我想创建一个简单的表来存储响应。一本书可以有多个作者，所以作者对象是一个数组。作者有两个字段（名字和姓氏） 我知道我必须对对象进行字符串化，但我不知道在哪里使用它。

function tableCreation(response) {
    let final ="<table>";
    final += "<th>ID</th><th>Title</th><th>Publisher</th><th>Author</th>";
    for (let i = 0; i < response.length; i++) {
        final += `<tr><td>${response[i].id}</td><td>${response[i].title}</td><td>${response[i].publisher}</td><td>${response[i].author}</td></tr>`;
                 }
    final +="</table>";
    document.getElementById("field").innerHTML = final;
}

这样显示表格：

ID | Title | Publisher |    Author
1     NAME     NAME     [object Object]

Answer 1

这是因为response[I].author是一个对象。 将其替换为 ${response[i].author.first_name} ${response[i].author.last_name}

Answer 2

那是因为你试图打印一个对象，而你实际上想打印 JSON，你可以这样做：

JSON.stringify(response[i].author)

代码看起来像这样：

function tableCreation(response) {
    let final ="<table>";
    final += "<th>ID</th><th>Title</th><th>Publisher</th><th>Author</th>";
    for (let i = 0; i < response.length; i++) {
        final += `<tr><td>${response[i].id}</td><td>${response[i].title}</td><td>${response[i].publisher}</td><td>${JSON.stringify(response[i].author)}</td></tr>`;
                 }
    final +="</table>";
    document.getElementById("field").innerHTML = final;
}