Merge the values of an object's key with commas

Question

Merge the values of an object's key with commas

I'm dealing with an array of objects that looks like this:

let modifiers = [
 {name: "House Fries", price: "2.00"},
 {name: "Baked Potato", price: "2.50"},
 {name: "Grits", price: "1.50"},
 {name: "Nothing on Side", price: "0.00"}
]

My goal is to concatenate the names of each object in the array with a comma separating them. The desired end result should look like this:

"House Fried, Baked Potato, Grits, Nothing of Side"

Can someone guide me on how to achieve this using TypeScript? Any assistance would be greatly appreciated.

javascript arrays typescript object concatenation

Answer 1

Answer №1

If you want to achieve this task, one way is to utilize the Array.prototype.map() method. Initially, retrieve all the names by utilizing the map method and then employing the Array.prototype.join() method to obtain a comma-separated string.

const extras = [
  { name: 'Salsa', price: '1.00' },
  { name: 'Guacamole', price: '2.00' },
  { name: 'Sour Cream', price: '1.50' },
  { name: 'Cheese', price: '1.25' },
];
const result = extras.map((item) => item.name).join(', ');
console.log(result);

Answer 2

If you want to achieve this task, one way is to utilize the Array.prototype.map() method. Initially, retrieve all the names by utilizing the map method and then employing the Array.prototype.join() method to obtain a comma-separated string.

const extras = [
  { name: 'Salsa', price: '1.00' },
  { name: 'Guacamole', price: '2.00' },
  { name: 'Sour Cream', price: '1.50' },
  { name: 'Cheese', price: '1.25' },
];
const result = extras.map((item) => item.name).join(', ');
console.log(result);

Merge the values of an object's key with commas

Answer №1

Similar questions

ReactJS Components failing to load on initial site visit, only appearing after refreshing for the second time

The JavascriptExecutor is unable to access the 'removeAttribute' property of a null object

What advantages does the use of $(e).attr(name,value) offer compared to using e.setAttribute(name,value)?

Creating a service instance within the constructor in Angular 2

Populate input fields in HTML using Angular 4

Error: The absence of an element identified by the locator does not cause the protractor spec to fail, but rather it executes successfully

"Exploring the power of asynchronous programming with dynamic async await in

In JavaScript, is it possible to dynamically alter and showcase the value of a select tag?

Creating an axios URL using Vue data results in receiving the value of undefined

What is the best way to resolve the unusual resolution issue that arises when switching from Next.js 12 to 13

Attempting to open and display the contents of a text file (.txt) within a modal dialog box upon clicking a button

Notify when a variable matches the value of a div

In JavaScript, I would like to be able to input an end date and have the program calculate and display the number of days remaining until the deadline

What could be causing my select tags to appear incorrectly in Firefox and IE?

Exploring Nested Routes and Queries in Vue JS

What is the best way to eliminate "?" from the URL while transferring data through the link component in next.js?

Sending Image Data in Base64 Format with Ajax - Dealing with Truncated Data

How about creating a Java program that generates randomized colors and sizes for drawing tiles

prior to activating a state in angular.js, navigate to a distinct controller

reversing an array does not have an effect