使用不同json變量的for循環顯示所有項目，而不是每個項目

Question

因此，根據我之前回答的問題（ 單擊此處 ）

我使用發送到js變量的php數據創建了第二個json變量，因此我已經有了一個顯示最后顯示的內容，用戶可以在其中讀取如下內容：

 [ //defined by var = book | remove url for privacy reason.
    {
        "id": 39,
        "title": "My Pet",
        "url": "https:///novel/my-pet/",
        "chapter": {
            "id": 1192,
            "title": "35",
            "url": "https:///my-pet-35/"
        }
    },
    {
        "id": 37,
        "title": "Nobunaga’s Imouto",
        "url": "https:///novel/nobunagas-imouto/",
        "chapter": {
            "id": 1449,
            "title": "2",
            "url": "https:///nobunaga-imouto-2/"
        }
    },
    {
        "id": 2,
        "title": "Duke's Daughter",
        "url": "https:///novel/dukes-daughter/",
        "chapter": {
            "id": 1398,
            "title": "99",
            "url": "https:///dukes-daughter-99/"
        }
    }
]

第一個json從cookie獲取數據，因此用戶可以跟蹤其最后一次讀取。 至於我的第二個json變量，則顯示類別中最新的帖子

[ //defined by var = newest
    {
        "id": 39,
        "title": "My Pet Chapter 35",
        "url": "https:///my-pet-35/",
    },
    {
        "id": 37,
        "title": "Nobunaga’s Imouto Chaoter 4",
        "url": "https:///nobunaga-imouto-4/",
    },
    {
        "id": 2,
        "title": "Duke's Daughter Chapter 106",
        "url": "https:///dukes-daughter-106/",
    }
]

然后我用for循環顯示它們：

    $bookcontainer = $('#release_history'); 
    for (var i in books) {
        var book = books[i];
        var html = '<div class="row"><div class="book_history">';
        html += '<a href="'+book.url+'">'+book.title+'</a></div>';

         // Display last user read from json

        html += '<div class="newest_history">';
        for (var j in newest) { // display the newest of a post from category
            var news = newest[j];
            html += '<a href="'+news.url+'">»Chapter '+news.title+'</a></div>';
        }
        html += '</div></div></div>';
        $bookcontainer.append(html);
    }

但是它將顯示如下：

因此，我認為如果兩個id相等，則添加有條件的。

            for (var j in newest) {
            var news = newest[j];
            if (news.id == book.id){
                html += '<a href="'+news.url+'">»Chapter '+news.title+'</a></div>';}
            }

但是，在顯示第一個輸出之后，循環將停止。 有什么解決辦法嗎？ 在顯示時將它們分開？ 我想顯示類別的最新章節，以便用戶知道他們最近閱讀的書中有新章節。

Answer 1

要檢查，如果index這兩個對象的ID都同樣喜歡，如果id在index:0和id在index:3相同隨后還它不會顯示出來，因為你沒有檢查它是否包含與否：

嘗試這個：

 var book = [ //defined by var = book { "id": 39, //Category ID "title": "Last Read A", "url": "Chapter URL A", }, { "id": 37, //Category ID "title": "Last Read B", "url": " Chapter URL C", }, { "id": 2, //Category ID "title": "Last Read C", "url": " Chapter URL C", } ] var book1 = [ //defined by var = newest { "id": 39, //Category ID "title": "Newest Chapter A", "url": "Post URL Chapter A", }, { "id": 37, //Category ID "title": "Newest Chapter B", "url": " Post URL Chapter C", }, { "id": 2, //Category ID "title": "Newest Chapter C", "url": " Post URL Chapter C", }, //Added a different book with id 10 { "id": 10, //Category ID "title": "Newest Chapter C", "url": " Post URL Chapter C", } ] const bookIds = book1.map(bookData => bookData.id); console.log('BookIDS:', bookIds) book.forEach(bookData => { if(bookIds.indexOf(bookData.id) > -1){ console.log('Matching book found with ID:', bookData.id); } }) 

Answer 2

因此，您只想知道當前用戶未讀過哪些書？

const books = [ //defined by var = book
    {
        "id": 39, //Category ID
        "title": "Last Read A",
        "url": "Chapter URL A",
    },
    {
        "id": 37, //Category ID
        "title": "Last Read B",
        "url": " Chapter URL C",
    },
    {
        "id": 2, //Category ID
        "title": "Last Read C",
        "url": " Chapter URL C",
    }
];

const newest = [ //defined by var = newest
    {
        "id": 39, //Category ID
        "title": "Newest Chapter A",
        "url": "Post URL Chapter A",
    },
    {
        "id": 37, //Category ID
        "title": "Newest Chapter B",
        "url": " Post URL Chapter C",
    },
    {
        "id": 2, //Category ID
        "title": "Last Read C",
        "url": " Chapter URL C",
    },

    //Added a different book with id 10
    {
        "id": 10, //Category ID
        "title": "Newest Chapter C",
        "url": " Post URL Chapter C",
    }
];

newBooks = newest.filter(function (element) {
    return books.filter(function (book) {
        if (element.id !== book.id) {
            return false;
        }

        if (element.title !== book.title) {
            return false;
        }

        return element.url === book.url;
    }).length === 0;
});

console.log(newBooks);

過濾功能允許您過濾條件為真的條目。

在此示例中，我檢查過濾后的書本數組的大小是否等於零。

零時，用戶未閱讀新章節。

因此，過濾后的書本數組給我的條目不等於“最新”數組的當前條目。

樣本輸出：

[ { id: 39, title: 'Newest Chapter A', url: 'Post URL Chapter A' },
{ id: 37, title: 'Newest Chapter B', url: ' Post URL Chapter C' },
{ id: 10, title: 'Newest Chapter C', url: ' Post URL Chapter C' } ]

如您所見，ID為“ 2”的條目已被過濾，因為它們具有相同的數據。

Answer 3

通過變更解決：

for (var j in newest)

至

for (var j = 0; j < newest.length; j++)

我覺得這樣在第二個循環中僅使用var j in錯誤的