Tips for utilizing the 'map' function with nested arrays within an array (JSON)

Question

Tips for utilizing the 'map' function with nested arrays within an array (JSON)

Below is the JSON data provided:

users = [{
  "name": "alex", 
   "id":123, 
   "surname":"xx", 
    tarriff: {
      "id":1,
      "name":"free"
    }
},
 {
  "name": "tom", 
   "id":124, 
   "surname":"henry", 
    tarriff: {
      "id":1,
      "name":"free"
    }
}

]

I am seeking assistance in filtering this data (specifically removing "surname":"xx", "surname":"henry" and others).

When attempting to use tarriff.name, it results in a syntax error.

$scope.userfilter = users.map(({name,id, tarriff.name}) => ({name, id, tariff_name}));

Please help me in finding the correct solution for this problem.

javascript arrays json

Answer 1

Answer №1

To create a new object with shorthand properties, you can utilize a destructuring assignment.

var users = [{ name: "alex", id: 123, surname: "xx", tarriff: { id: 1, name: "free" } }, { name: "tom", id: 124, surname: "henry", tarriff: { id: 1, name: "free" } }],
    result = users.map(({ name, id, tarriff }) => ({ name, id, tarriff_name: tarriff.name }));
    
console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

Answer 2

To create a new object with shorthand properties, you can utilize a destructuring assignment.

var users = [{ name: "alex", id: 123, surname: "xx", tarriff: { id: 1, name: "free" } }, { name: "tom", id: 124, surname: "henry", tarriff: { id: 1, name: "free" } }],
    result = users.map(({ name, id, tarriff }) => ({ name, id, tarriff_name: tarriff.name }));
    
console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

Answer 3

Answer №2

The variable users you have defined is of type object, not an array. It appears to be a common mistake and what you are actually trying to achieve is filtering an array. To filter an array, you should utilize the filter method as demonstrated below:

const users = [
  {"name": "alex", "id":123, "surname":"xx", tarriff:{"id":1,"name":"free"}},
  {"name": "emma", "id":123, "surname":"yy", tarriff:{"id":2,"name":"anna"}}
];

const criterion = "free";
const filteredUsers = users.filter(user => user.tarriff.name == criterion);

console.log(filteredUsers)

Answer 4

The variable users you have defined is of type object, not an array. It appears to be a common mistake and what you are actually trying to achieve is filtering an array. To filter an array, you should utilize the filter method as demonstrated below:

const users = [
  {"name": "alex", "id":123, "surname":"xx", tarriff:{"id":1,"name":"free"}},
  {"name": "emma", "id":123, "surname":"yy", tarriff:{"id":2,"name":"anna"}}
];

const criterion = "free";
const filteredUsers = users.filter(user => user.tarriff.name == criterion);

console.log(filteredUsers)

Answer 5

Answer №3

It can be quite challenging to comprehend your exact needs. My assumption is that you are interested in deep mapping rather than Array.filter.

The error in syntax arises from incorrect de-structuring. Here is a more proper approach:

$scope.userfilter = users.map( ({name, id, tarriff: { name: tarriff_name }}) => {
    return {name, id, tariff_name};
});

Answer 6

It can be quite challenging to comprehend your exact needs. My assumption is that you are interested in deep mapping rather than Array.filter.

The error in syntax arises from incorrect de-structuring. Here is a more proper approach:

$scope.userfilter = users.map( ({name, id, tarriff: { name: tarriff_name }}) => {
    return {name, id, tariff_name};
});

Tips for utilizing the 'map' function with nested arrays within an array (JSON)

Answer №1

Answer №2

Answer №3

Similar questions

Inquire data using a SQL-style query in JSON format with

Tips for utilizing SlowCheetah to modify array elements within a Json configuration file

Previous Button on jQuery/Javascript Slider Not Functioning

Transitioning the existing application from iOS Cordova's UIWebView to WKWebView requires disabling asynchronous JavaScript execution in order to maintain functionality

Jackson Password Serialization for Enhanced Security

Tips for saving a JavaScript object into a JSON file

SVG to PDF conversion is successful with Plotly.js, however, C3.js is currently experiencing issues with this

Exploring the Express problem with AWS SNS web service subscriptions using a Sinatra case study

Modifying the color of a specific node in jstree

Issue with Custom Tooltip in Mootools 1.2 - Images displaying prematurely before hover action

Obtaining a JSON reply using Ember

Iterate over the key-value pairs in a loop

Avoiding duplication of user input within a 2D matrix in Java

Deactivate a Specific Popup for a Specific Page

Struggling to achieve desired output from function in NextJS

Unable to retrieve all AJAX responses during page loading in Puppeteer

Parsing Multidimensional JSON Arrays Using ASP.NET Core

Sequelize transforms any given date object into a local date representation

Rendering items in a list with React does not just display the last item on the list

Discovering ways to monitor Service Providers