¿Hay alguna manera de escribir las declaraciones if en este código menos repetitivas? ¿Cómo lo hago más corto?
useEffect(() => { function addDefaultCards() { Object.entries(allCurrencies).map((item) => { if (item[0] === "EUR") { setCards((prevItems) => [...prevItems, item]); } if (item[0] === "USD") { setCards((prevItems) => [...prevItems, item]); } if (item[0] === "RUB") { setCards((prevItems) => [...prevItems, item]); } if (item[0] === "INR") { setCards((prevItems) => [...prevItems, item]); } }); return cards; } addDefaultCards(); }, [allCurrencies]);Parece que solo necesita una variedad de monedas para verificar la inclusión.
const currencies = ['EUR', 'USD', 'RUB', 'INR']; useEffect(() => { Object.entries(allCurrencies).forEach((entry) => { if (currencies.includes(entry[0])) { setCards((prevItems) => [...prevItems, entry]); } }); }, [allCurrencies]); No necesita la función addDefaultCards anidada adicional, y solo debe usar .map cuando construya una nueva matriz uno a uno regresando de la devolución de llamada .map (que no está haciendo). Para efectos secundarios, use forEach o un bucle for. Tampoco necesita return cards , ya que nada usa el valor de retorno de addDefaultCards .
Primero debe filtrar la matriz y luego llamar a setCards :
useEffect(() => { function addDefaultCards() { const items = Object.entries(allCurrencies).filter((item) => { return ["EUR", "USD", "RUB", "INR"].includes(item[0]); }); setCards((prevItems) => [...prevItems, ...items]); } addDefaultCards(); }, [allCurrencies])También puede hacerlo sin una función de contenedor:
useEffect(() => { const items = Object.entries(allCurrencies).filter((item) => { return ["EUR", "USD", "RUB", "INR"].includes(item[0]); }); setCards((prevItems) => [...prevItems, ...items]); }, [allCurrencies])