如何在数组中找到特定项目？

Question

我需要在数组中找到一些项目并过滤它以在 DOM 中显示，例如我想找到我点击它的任何标题。但它不起作用。我的代码是：

let addBtn = document.querySelectorAll('.cart-btn')
let i
const shoppingCart = () => {
    localStorage.setItem('myProduct', JSON.stringify(products))
    const getStorage = localStorage.getItem('myProduct')
    const finalProducts = JSON.parse(getStorage)
    finalProducts.map(item => {
        if (item.id === products.id) {
            console.log(item.title)
        } else {
            console.log("Not found")
        }
    })
    console.log(finalProducts.title)
}
for (i = 0; i < products.length; i++) {
    addBtn[i].addEventListener('click', shoppingCart)
}

Answer 1

您可以像这样使用Array.flter()函数：

finalProducts.filter(item => item.id === products.id)

在您的代码中，用filter()函数替换map() filter()函数。

let addBtn = document.querySelectorAll('.cart-btn')

const shoppingCart = (itemid) => {

    localStorage.setItem('myProduct', JSON.stringify(products))
    const getStorage = localStorage.getItem('myProduct')
    const finalProducts = JSON.parse(getStorage)

    let selected = finalProducts.filter(item => item.id === itemid)
    if (selected.length>0)
        console.log(selected[i].title)
    else
        console.log('Not found: ' + itemid)
}

for (let i = 0; i < products.length; i++) {
    addBtn[i].addEventListener('click', _ => { shoppingCart(i) })
}

Answer 2

您可以使用 foreach 和过滤器。 你可以尝试这样的事情。

finalProducts.forEach(item => {
    let itemFound = products.filter(product => product.id === item.id)
    console.log(itemFound.title)
})