Adding elements in an array depending on the values in a separate array

Question

Adding elements in an array depending on the values in a separate array

I am currently working on a task that involves summing values in an array of objects based on the Ids present in another array within the same object. Let's assume I have the following queryArray:

const queryArray = [ "1" , "2" ]

and this is the services array from which I would like to sum the fees property values if their Id matches with queryArray:

const services = [
  {
    Id: "1",
    services: "Early Check-In",
    fees: "7500"
  },
  {
    Id: "2",
    services: "Late Checkout",
    fees: "7500"
  },
  {
    Id: "3",
    services: "Airport Chauffeur",
    fees: "25000"
  }
]

So, I want to calculate the total sum of the fees property value in the services array by matching the Ids available in the queryArray. For example, when using the queryArray:

[ "1" , "2" ]

The expected result should be:

If we use:

[ "1" , "3" ]

The expected result would be:

And for:

[ "1", "2" , "3"]

The expected result should be:

As a beginner in javascript, I am struggling to find a solution or even know where to start. Any guidance or suggestion would be greatly appreciated.

javascript arrays algorithm

Answer 1

Answer №1

Of course, start by using the filter function to sort through the services you require -> Then apply the map function to each service to retrieve its value -> Finally, utilize the reduce function to condense the list into a single number by summing up all elements:

const services = [
  {
    Id: "1",
    services: "Early Check-In",
    fees: "7500"
  },
  {
    Id: "2",
    services: "Late Checkout",
    fees: "7500"
  },
  {
    Id: "3",
    services: "Airport Chauffeur",
    fees: "25000"
  }
]
const ids = ["1" , "2"]

console.log(
  services
    .filter(({Id}) => ids.includes(Id))
    .map(({fees}) => parseFloat(fees))
    .reduce((acc, fees) => acc + fees, 0)
  
)

Answer 2

Of course, start by using the filter function to sort through the services you require -> Then apply the map function to each service to retrieve its value -> Finally, utilize the reduce function to condense the list into a single number by summing up all elements:

const services = [
  {
    Id: "1",
    services: "Early Check-In",
    fees: "7500"
  },
  {
    Id: "2",
    services: "Late Checkout",
    fees: "7500"
  },
  {
    Id: "3",
    services: "Airport Chauffeur",
    fees: "25000"
  }
]
const ids = ["1" , "2"]

console.log(
  services
    .filter(({Id}) => ids.includes(Id))
    .map(({fees}) => parseFloat(fees))
    .reduce((acc, fees) => acc + fees, 0)
  
)

Answer 3

Answer №2

Verify if the identifier is part of the identification array within the reducer:

const amenities = [
  {
    Id: "1",
    serviceType: "Early Check-In",
    cost: "7500"
  },
  {
    Id: "2",
    serviceType: "Late Checkout",
    cost: "7500"
  },
  {
    Id: "3",
    serviceType: "Airport Chauffeur",
    cost: "25000"
  }
]

const selectionArray = [ "1" , "2" ]

const result = amenities.reduce((totalCost, currentService) => selectionArray.includes(currentService.Id) ? totalCost += +currentService.cost : totalCost, 0)

console.log(result)

Answer 4

Verify if the identifier is part of the identification array within the reducer:

const amenities = [
  {
    Id: "1",
    serviceType: "Early Check-In",
    cost: "7500"
  },
  {
    Id: "2",
    serviceType: "Late Checkout",
    cost: "7500"
  },
  {
    Id: "3",
    serviceType: "Airport Chauffeur",
    cost: "25000"
  }
]

const selectionArray = [ "1" , "2" ]

const result = amenities.reduce((totalCost, currentService) => selectionArray.includes(currentService.Id) ? totalCost += +currentService.cost : totalCost, 0)

console.log(result)

Answer 5

Answer №3

Another approach is to utilize the reduce method, where you iterate through each entry and check if the Id matches any value in the queryArray. If there's a match, add the current fees to the running total.

Initialize the starting value as 0.

const services = [{
    Id: "1",
    services: "Early Check-In",
    fees: "7500"
  },
  {
    Id: "2",
    services: "Late Checkout",
    fees: "7500"
  },
  {
    Id: "3",
    services: "Airport Chauffeur",
    fees: "25000"
  }
]

const queryArray = ["1", "2"]

let res = services.reduce(
  (total, curr) => queryArray.includes(curr.Id) ? total + parseInt(curr.fees, 10) : total,
  0
);
console.log(res);

Answer 6

Another approach is to utilize the reduce method, where you iterate through each entry and check if the Id matches any value in the queryArray. If there's a match, add the current fees to the running total.

Initialize the starting value as 0.

const services = [{
    Id: "1",
    services: "Early Check-In",
    fees: "7500"
  },
  {
    Id: "2",
    services: "Late Checkout",
    fees: "7500"
  },
  {
    Id: "3",
    services: "Airport Chauffeur",
    fees: "25000"
  }
]

const queryArray = ["1", "2"]

let res = services.reduce(
  (total, curr) => queryArray.includes(curr.Id) ? total + parseInt(curr.fees, 10) : total,
  0
);
console.log(res);

Adding elements in an array depending on the values in a separate array

Answer №1

Answer №2

Answer №3

Similar questions

Is it possible to view the code within the .js files located in the api directory of NextJS using web browsers?

List item with React Material UI tooltip

The Socket IO Client is receiving a different object than the one that was sent by the Server

JavaScript - Merging the two JSON requests into a unified object

React Material UI issue: You cannot render objects as a React child. If you intended to display a group of children, make sure to use an array instead

The battle between CSS and jQuery: A guide to creating a dynamic zebra-style table without relying on additional plugins

Combining Mongoose OR conditions with ObjectIDs

Exploring the World of Next.js and Sequelize Model Relationships

After refreshing, the LocalStorage in Angular 2 seems to disappear

Troubleshooting the issue: AngularJS not functioning properly with radio button selection to show specific div containing input field

Clicking on the button will result in the addition of new

When I click a button in d3 to refresh the data on my bar graph, the text fails to update accordingly

NPM - Include in package.json without installation

Have you ever wondered why req.body returns as undefined when using body parser?

Creating distinctive identifiers for individual function parameters in JavaScript using addEventListener

How does Vue handle the situation when the value of an input field does not match the bound "data"?

Display the mobile keyboard without the presence of an input element

Dynamic resizing in NextJs does not trigger a re-render

SSI stands for Server Side Includes, a feature that allows

Node.js and Express.js fails to transmit files to clients