useEffect(() => {
cat &&
setFilteredProducts(
products.filter((item) =>
Object.entries(filters).every(([key, value]) =>
item[key].includes(value)
)
)
);
}, [products, cat, filters]);
我一直在一遍又一遍地觀看視頻，但我似乎無法正確理解它，有人可以幫我逐行解釋嗎？我明白了“cat &&”的意思，但其余的讓我感到困惑。
uj5u.com熱心網友回復：
逐行瀏覽上面的代碼：
我假設您有一個帶有 setter 函式setFilteredProducts和兩個陣列productsand的狀態變數filters，每個陣列都有物件作為值。
我們正在從存盤在products變數中的過濾值中設定狀態變數中的值。
Object.entries簡單地回傳一個陣列，其中每一項都是一個陣列，它的第一個值作為鍵，第二個值作為對應的值，every是另一個應用于函式回傳的陣列的Object.entries函式
該every函式接受一個回呼函式作為引數，它測驗陣列中的所有元素是否通過回呼實作的測驗。
在這種情況下，實作的測驗是item[key].includes(value)，它測驗 products 陣列中的每個迭代元素（一個物件）是否都有一個對應于key其中的陣列value。
你可以參考
Object.entries這里：https : //developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/entries
Array.prototype.every: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/every
Array.prototype.filter: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter
Array.prototype.includes: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/361586.html
標籤：javascript 反应 目的 逻辑 使用效果
上一篇：如何創建以變數為鍵的物件？