Estoy estudiando Javascript y tengo este ejemplo usando filtro...
Tengo un objeto llamado frutas así...
let data = { "fruits": [{ "id": 0, "name": "plum", "description": "A plum is a purple fruit.", "image": "https://cdn.shopify.com/s/files/1/0610/2881/products/cherries.jpg?v=1446676415", "price": 220 }, { "id": 1, "name": "Apple", "description": "An apple is a sweet, edible fruit produced by an apple tree. Apple trees are cultivated worldwide and are the most widely grown species in the genus Malus.", "image": "https://upload.wikimedia.org/wikipedia/commons/thumb/1/15/Red_Apple.jpg/265px-Red_Apple.jpg", "price": 35 }, { "id": 2, "name": "Banana", "description": "A banana is an edible fruit – botanically a berry – produced by several kinds of large herbaceous flowering plants in the genus Musa. In some countries, bananas used for cooking may be called plantains, distinguishing them from dessert banana", "image": "https://upload.wikimedia.org/wikipedia/commons/thumb/4/44/Bananas_white_background_DS.jpg/320px-Bananas_white_background_DS.jpg", "price": 12 }, { "id": 3, "name": "Grapes", "description": "A small bunched fruit used to make wine", "image": "https://upload.wikimedia.org/wikipedia/commons/thumb/b/bb/Table_grapes_on_white.jpg/320px-Table_grapes_on_white.jpg", "weight": 0.1, "price": 45 }...Tengo un carrito con los artículos de frutas.
cart = [0, 3, 4, 5, 3]esta es la parte que no entiendo...
const getCostOf = id => (data.fruits.filter(item => item.id == id))[0].priceque estas haciendo
[0].price??? ¿Por qué tengo que obtener el elemento [0] si el elemento va a cambiar en cada paso?
Si tengo otra función...
const getTotal = cart => { let total = 0; cart.map(item => total += getCostOf(item)) return total; } ¿Por qué en getConstOf
El ejemplo está usando [0].price y no [item].price ?
Dijiste que tenías una variable de datos que es una matriz. Pero a partir de su ejemplo, parece que sus datos variables son, de hecho, un objeto y no una matriz. Y el método de filtro solo se puede usar para matrices y no para objetos.
Entonces, lo que debe hacer para que el método de filtro comience a filtrar es perforar su objeto y agarrar la tecla "frutas" como la matriz en su ejemplo y puede hacerlo así:
data.fruits , entonces puede filtrar esos objetos dentro de la matriz de frutas. es decir
const getCostOf = id => data.fruits.filter(item => item.id == id))[0].price En cuanto a su [0].price sin él, tendrá un retorno de la matriz de objetos que su parámetro de id coincide con el item.id Entonces [0] está diciendo que desea que se devuelva el primer elemento de la matriz. Y ahora está devolviendo el objeto de la matriz. luego indique con precisión que quería el precio para que .price le dé el precio.
Entonces, al final, en el ejemplo id = 3, el precio sería 45 de su resultado
const getCostOf = id => data.fruits.filter(item => item.id === id)[0].price console.log(getCostOf(3))filter() devuelve una matriz con todos los elementos que coinciden con los criterios dados. En este caso item => item.id == id , por lo que todos los elementos que coincidan con la id proporcionada. El [0] después toma el primer elemento coincidente y .price le dará el precio del artículo coincidente.
Sin embargo, si tiene muchos productos, una mejor opción para encontrar el primer producto es find() . Que itera hasta que encuentra una coincidencia y la devuelve directamente en lugar de intentar encontrar todas las coincidencias.
const getCostOf = id => data.fruits.find(item => item.id == id).price; O si llama a getCostOf() a menudo, es posible que desee preparar la estructura de datos e indexar los elementos en función de la id en un Map . Esto introduce algunos gastos generales, pero valdrá la pena si necesita buscar elementos con frecuencia.
const fruits = new Map(data.fruits.map(item => [item.id, item])); const getCostOf = id => fruits.get(id).price; Esta última solución asume que los identificadores son únicos. Si no lo son, las versiones posteriores de un elemento con la misma identificación anularán las versiones anteriores definidas. Resultando en el último artículo devuelto en lugar del primero. También debe actualizar las fruits si se reemplaza data.fruits o se agregan/eliminan elementos de la matriz.
data.fruits.filter(item => item.id == id) crea una matriz con un solo producto, el que tiene la id dada en el parámetro. Acceder a esta matriz con [0] obtendrá el único producto de la matriz y .price devolverá su precio