Tengo una matriz como esta:
parts: [ { name: 'Fundamentals of React', exercises: 10, id: 1 }, { name: 'Using props to pass data', exercises: 7, id: 2 }, { name: 'State of a component', exercises: 14, id: 3 }, { name: 'Redux', exercises: 11, id: 4 } ]Me gustaría obtener la suma de los ejercicios. Estoy tratando de lograrlo así:
const Total = (props) => { const total = props.parts.reduce( (prev, cur) => { console.log('prev.excercises : ', prev.exercises) console.log('cur.excercises : ', cur.exercises) return prev.exercises + cur.exercises }) return ( <> <p>Number of exercises {total}</p> </> ) }Pero esto da como resultado NaN. La consola muestra por qué ocurre este resultado, pero no por qué el valor prev.excercises está actuando de manera extraña:
prev.excercises : 10 cur.excercises : 7 prev.excercises : undefined cur.excercises : 14 prev.excercises : undefined cur.excercises : 11Soy realmente nuevo en js, por lo que probablemente haya algo realmente simple que esté haciendo mal ... ¡agradezco la ayuda de antemano!
Está intentando acceder a él como un objeto pero lo está devolviendo como un número entero
const Total = (props) => { const total = props.parts.reduce( (prev, cur) => { console.log('prev.excercises : ', prev.exercises) console.log('cur.excercises : ', cur.exercises) return {exercises : prev.exercises + cur.exercises} })Si no desea devolver el objeto, puede hacerlo así.
const total = props.parts.reduce( (prev, cur) => { prev=typeof prev==="object" ? prev.exercises:prev console.log('prev.excercises : ', prev) console.log('cur.excercises : ', cur.exercises) return prev+ cur.exercises })También lo hice funcionar así, ¡pero supongo que la respuesta de Ahmed Ali es más directa!
const Total = (props) => { const total = props.parts.map(part => part.exercises). reduce((prev, cur) => { console.log('prev : ', prev) console.log('cur : ', cur) return prev + cur })