Extract particular elements from an array and transform them into a new array

Presented below is an array:

[{
"title": "Apple iPhone 7 Plus 32 GB",
"category": "phone",
"brand": "apple",
"condition": "Used",
"price": 800,
"id": 0,
"description": "Apple"
}, {
    "title": "Apple Ipad Air 32 GB",
    "category": "tablet",

    "brand": "apple",
    "condition": "new",
    "price": 1000,
    "id": 1,
    "description": "Apple"
},{
    "title": "Supreme Box Logo Hooded Sweatshirt Navy",
    "category": "clothes",
    "brand": "Supreme",
    "condition": "new",
    "price": 1000,
    "id": 2,
    "description": "Supreme Size M"
},]

Is there a method to extract only the values of category from the aforementioned array and transform them into an array like this?

[{"phone","clothes","tablet"}]

Answer №1

Iterate over your array and extract the category of each item.

In addition, [{"phone","clothes","tablet"}] is not valid; an object consists of key-value pairs, so I assume you intended to write ["phone","clothes","tablet"]

const items = [{
"title": "Apple iPhone 7 Plus 32 GB",
"category": "phone",
"brand": "apple",
"condition": "Used",
"price": 800,
"id": 0,
"description": "Apple"
}, {
    "title": "Apple Ipad Air 32 GB",
    "category": "tablet",

    "brand": "apple",
    "condition": "new",
    "price": 1000,
    "id": 1,
    "description": "Apple"
},{
    "title": "Supreme Box Logo Hooded Sweatshirt Navy",
    "category": "clothes",
    "brand": "Supreme",
    "condition": "new",
    "price": 1000,
    "id": 2,
    "description": "Supreme Size M"
},];

const newItems = items.map(item => item.category);
console.log(newItems)

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

The setting `ensureCleanSession: true` doesn't appear to be effective when included in the capabilities for Internet Explorer 11

Currently, I am testing a login/logout application with the help of protractor. One challenge I am facing is dealing with a popup that appears after each login/logout scenario. In order to ensure the popup appears after each login, I need to reset the IE ...

Exploring Multilingual Autocomplete or: Best Practices for Managing Multiple Languages in Web Applications

I'm currently developing a website and I have a mysql-table named 'items' with the following structure: item_id | item (The second column is used to identify the item_id.) In a file called language1.php, I have an array that stores the it ...

Populating a JSON object with data pulled from a mix of variables and objects

I am working towards a scenario where I need to create an object variable that starts empty but gradually gets filled with data from other variables as the code runs. The final representation of this object should look like this: { "banana" : { ...

What is the best way to transfer the "user" object from TopBar.js to App.js in my project?

In my project, TopBar.js functions as an AppBar component responsible for handling user authentication. When a user logs in, I receive an object called "user". My goal is to export this "user" object to App.js. If I am successful in exporting it to App.js ...

Is it time to refresh the sibling element when it's selected, or is there

I have recently started working with react and TypeScript, and I am facing some challenges. My current task involves modifying the functionality to display subscriptions and transactions on separate pages instead of together on the same page. I want to sh ...

How can Python be used to substitute a randomly chosen character in one string with another randomly selected character from a different string?

I want to create a fun guessing game where, after each guess, a dash is replaced with the correct character. Here's a simple example: import random word = input("Enter a word") # Get user input word_length = len(word) #Get word length dash ...

Attention: React is unable to identify the `pId` property on a DOM element

After removing the span tag below, I noticed that there were no warnings displayed. <span onClick={onCommentClick} className={'comment'}> <AiOutlineComment className={"i"} size={"20px"}/> Co ...

Ways to assign a value to an input element in AngularJS without impacting its ngModel

JAVASCRIPT: .directive('search', [function () { return { restrict: 'A', link: function (scope, element, attrs) { attrs.$set('placeholder', 'Word...'); console.log(attrs); ...

Unable to use the same hexadecimal HTML entity in the value props of a React JSX component

Can someone explain why this code snippet displays dots as password and the other displays plain hexadecimal codes? <Field label="Password" value="&#x2022;&#x2022;&#x2022;&#x2022;&#x2022;" type="password" /> While this one disp ...

How can I reverse a regex replace for sentences starting with a tab in JavaScript?

In order to format the text properly, I need to ensure that all sentences begin with only one Tab [key \t] and remove any additional tabs. input This is aciton Two tab One tabdialog This is aciton Two tab Second tabdialog out ...

Using JavaScript to create a JSON object within a table

Currently, I am facing a challenge in creating a JSON object from an HTML table using JavaScript. While I can successfully retrieve the values of each cell in JavaScript, the issue lies in organizing and retrieving them as per my requirements. Here is the ...

Access exclusive content by subscribing now!

How can I return a reference to a subject from a service without allowing the receiver to call .next() on the subject? Let's say there is a service with a subject that triggers new events. class ExampleService { private exampleSubject = new Subjec ...

Transferring an array from PHP to jQuery through the use of AJAX

My JavaScript code communicates with a PHP page to retrieve data from a database and store it in an array. Now, I would like to use jQuery to loop through that array. This is how the array is structured: Array ( [0] => Array ( [image] => articl ...

Upgrading to React Router v6: Implementing Loader Functions with Context API

Having issues implementing loaders in React-Router V6 while making a request for a page through a function located in the context file. Unfortunately, I can't access the context from main.js where the router is defined. Main.js import ReactDOM from & ...

Is it possible to establish communication between JAVA and Javascript using Sockets?

Recently, I developed a Java application that generates some data and saves it in a text file on my computer. Instead of saving this data in a text file, I am looking to send it via Socket. Here is an example: Java public static void main(String argv[] ...

"An error occurred: Uncaught SyntaxError - The import statement can only be used within a module. Including a TypeScript file into a

I need to integrate an Angular 10 TypeScript service into a jQuery file, but I am facing an issue. When I try to import the TypeScript service file into my jQuery file, I encounter the following error: Uncaught SyntaxError: Cannot use import statement outs ...

AngularJS - let's make pagination more interactive by adding an active class to the current page

Check out this fiddle I created: http://jsfiddle.net/tbuchanan/eqtxLkbg/4/ Everything is working as intended, but I'm looking to add an active class to the current page when navigating through the pages: <ul class="pagination-controle pagination" ...

Determine the latest date within each group and display the corresponding output value

I am seeking a way to showcase only the most recent value for each group. For example, in the CSV data provided below, the total amount of Bagels in the Cinnamon Raisin variety were collected during three different sampling periods: May 2017, March 2017, ...

Enhance your webpage's body by zooming in using jQuery on Mozilla Firefox

I have a webpage and I would like to zoom its body when it loads using jQuery. However, the CSS zoom feature is not working in Mozilla Firefox. This is what I currently am using: $("body").css("zoom", "1.05"); It worked in Chrome, Opera, and Edge, but un ...

Can someone guide me on how to locate and access the port number?

In my Reactjs project root directory, I've created a .env file. This is what's inside my .env file: PORT = 30001 ... In my App.tsx file, I'm trying to access the port like this: const PORT_NUMBER = process.env.PORT; When I run yarn start ...