Does the reduce method work by default like this?

Question

Does the reduce method work by default like this?

const product_list=[{id:1},{id:2}]
const temp_products=[{id:1,quantity:10},{id:2,quantity:20}]
product_list.map(prod=>{
    console.log(temp_products.reduce((init,curr_prod)=>{
       return curr_prod.id == prod.id ? curr_prod.quantity : null
    }))
})

// null
// 20

The condition for the second object evaluates to true, but unfortunately, for the first object, it evaluates to false when it should be true.

The reduce function successfully retrieves the quantity from the second object, however, for the first object, it returns null instead. Why is this happening?

javascript arrays object

Answer 1

Answer №1

An interesting aspect of the reduce function is that when a seed value is not provided, the first call combines the first and second elements.

Your code also needs to ensure that the init value is returned from the reduce function.

Furthermore, instead of using map, consider using forEach if you are not concerned with the result of the map operation.

const product_list=[{id:1},{id:2}]
const temp_products=[{id:1,quantity:10},{id:2,quantity:20}]
product_list.forEach(prod=>{
    console.log(temp_products.reduce((init,curr_prod)=>{
       return curr_prod.id == prod.id ? curr_prod.quantity : init
    },null))
})

// 10
// 20

Answer 2

An interesting aspect of the reduce function is that when a seed value is not provided, the first call combines the first and second elements.

Your code also needs to ensure that the init value is returned from the reduce function.

Furthermore, instead of using map, consider using forEach if you are not concerned with the result of the map operation.

const product_list=[{id:1},{id:2}]
const temp_products=[{id:1,quantity:10},{id:2,quantity:20}]
product_list.forEach(prod=>{
    console.log(temp_products.reduce((init,curr_prod)=>{
       return curr_prod.id == prod.id ? curr_prod.quantity : init
    },null))
})

// 10
// 20

Answer 3

Answer №2

It's unclear what the intention behind using the map function is in this scenario. Perhaps considering the forEach function would be more appropriate since it appears that a looping operation is desired.

To clarify, the map function is typically utilized for transforming objects within a source array into a new structure within a separate array.

Alternatively, you might want to explore using the find function which identifies the first matching item (based on a specified condition) within an array.

const product_list = [{
  id: 1
}, {
  id: 2
}]
const temp_products = [{
  id: 1,
  quantity: 10
}, {
  id: 2,
  quantity: 20
}];

product_list.forEach(prod => {
  let found = temp_products.find(curr_prod => {
    return curr_prod.id == prod.id;
  });
  
  if (found) 
    console.log(found.quantity);
});

Answer 4

It's unclear what the intention behind using the map function is in this scenario. Perhaps considering the forEach function would be more appropriate since it appears that a looping operation is desired.

To clarify, the map function is typically utilized for transforming objects within a source array into a new structure within a separate array.

Alternatively, you might want to explore using the find function which identifies the first matching item (based on a specified condition) within an array.

const product_list = [{
  id: 1
}, {
  id: 2
}]
const temp_products = [{
  id: 1,
  quantity: 10
}, {
  id: 2,
  quantity: 20
}];

product_list.forEach(prod => {
  let found = temp_products.find(curr_prod => {
    return curr_prod.id == prod.id;
  });
  
  if (found) 
    console.log(found.quantity);
});

Does the reduce method work by default like this?

Answer №1

Answer №2

Similar questions

The visual representation is not being generated (three.js)

Node.js reads and writes a JSON file, encountering issues with another application in the process

Obtain non-numeric parameters from the URL in Angular 2 by subscribing to

Issues with AngularJS email validation specifically related to domain names are causing errors

Encountered a glitch while trying to install React JS using npx create-react-app xyz

Tips for preserving state with history.replaceState

Take the inputs, calculate the total by multiplying with the price, and then show

Deleting a node from a Swift SpriteKit array

What is the functionality of the protection against AngularJS JSON vulnerability?

Storing a JSON as a cookie in a Django response

PHP Form encountering error due to JSON decoding following an AJAX request

Incorporate a 'back' button in the tab content of vue-form-wizard

Is there a way to trigger Material-UI SpeedDialAction onClick events only when the SpeedDial is open and clicked, not when it is hovered over?

Creating a personalized image download feature in PhotoSwipe.js

Issue with Empty Date Time Format in Vue2 Date-Picker

Efficiently reducing the size of a CSS selector string with javascript

Hide multiple divs with similar ids in JQuery when clicking outside of them

How can I utilize JQ to display two specific objects located within an array in a JSON file?

Drop down menus fail to appear after the screen has been resized

Challenges with Input Nesting