Obtain values of properties from deeply nested arrays containing objects and arrays

Here is a nested array of objects that contains information:

[
    {
        "info": [
            {
                "period": {
                    "start": "2020-01-01",
                    "end": "2020-01-31"
                },
                "info": [
                    {
                        "id": 036,
                        "name": "john",
                    },
                    {
                        "id": 037,
                        "name": "inna",
                    }
                ]
            }
        ]
    },
    {
        "info": [
            {
                "period": {
                    "start": "2020-01-01",
                    "end": "2020-01-31"
                },
                "info": [
                    {
                        "id": 045,
                        "name": "carl",
                    },
                    {
                        "id": 056,
                        "name": "tina",
                    }
                ]
            }
        ]
    }]

The goal is to extract all the values of the "name" property and store them in an array.

Desired Output: ["john", "inna", "carl", "tina"].

Answer №1

Check out this example:

const userList = [];

information.forEach(data => {
    return data.detail.forEach(record => {
        return record.userList.forEach(user => userList.push(user.firstname));
    })
})

Result:

["alice", "bob", "carol", "dave"]

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

EdgesGeometry: raycasting precision issues

I'm currently working with EdgesGeometry on PlaneGeometry and it appears to be creating a larger hitbox in mouse events. Interestingly, this issue doesn't arise when using CircleGeometry. Below is the code snippet I am using: createPanel = f ...

Methods for ensuring that fake browser tab focus remains on several tabs simultaneously

Is there a way to simulate multiple tab/window focus in a browser for testing purposes? I need to test pages that require user input and focus on active windows/tabs. Are there any different browsers, plugins, or JavaScript code that can help me achieve th ...

Are there any uncomplicated JavaScript tools for creating spreadsheets?

I am in the process of developing a basic web-based expense calculator using asp.net web forms. Each cell will contain a text box, and the objective is to save each value (excluding the totals) to a database. I plan to have an expense table and an expense_ ...

The entire DOM in Angular2+ flickers upon loading a component using ngFor

I am facing an issue where, after a user clicks on an item to add it to a list and then renders the list using ngFor, there is a flickering effect on the screen/DOM. The strange thing is that this flicker only happens after adding the first item; subsequen ...

A guide to accurately fetching the transform properties of an SVG element within a d3.transition

Currently, I am experimenting with d3 animations using d3.transitions specifically involving circles. Consider the circle animation example below (d3.transition()): animationTime = 500; svg = d3.select('#svg'); // Locate th ...

"Implementing a loading function on a particular div element within a loop using

Hey everyone! I'm new to this forum and have recently made the switch from jQuery to Vue.js - what a game-changer! However, I've hit a little snag. I need to set v-loading on multiple buttons in a loop and have it start showing when clicked. Her ...

Retrieving JSON data with SQL

I'm attempting to extract the JSON message below using SQL: { "document": { "Invoice": { "_NavRecordId": "Purch. Inv. Header: 06IF+230033", "InvoiceNumber": "06 ...

tag of data in jquery

Here is how my setup looks: <div onclick="EditCalendarEvent('@_schedulerEvent.SchedulerID','@_schedulerEvent.SchedulerItemID', event)" class="ScheduleEvent_Draggable ScheduleEvent" data-schedulerID="@_schedul ...

Unraveling the mystery: Retrieving data from various child components within a Vue parent component

Currently, I am in the process of constructing a view that includes a primary component called ContentComponent. This component acts as a container for a series of sub-components, each representing a form module. The list of forms include: EvaluationForm ...

Troubleshooting hidden element display issues in IE7 with JQuery

My show/hide function is not working in IE7, however it works fine in other browsers. Can someone please assist me? Am I doing something incorrectly? <div id="secondary_nav" class="box"> <ul> <li>< ...

In ReactJS, one can create a variable and include a map function by first declaring the variable and then using the map function within the component. If you

Having trouble integrating the accordian.js page into the app.js main page for compilation. Need help defining and writing out the function correctly, any suggestions? Below is my code: App.js: How do I incorporate the components from the accordian.js pa ...

Issues with Bootstrap 4 accordions failing to expand on mobile devices

I'm facing a strange issue with my Bootstrap 4 accordions. They work fine in responsive mode on Chrome, but when I try it on an Android phone or iPhone, they refuse to open. I'm really puzzled by this. Any thoughts on what might be causing this? ...

Invoking an express route using JavaScript

After successfully defining some routes, including a text input search field at the top of the page, I created a listener function as shown below: $('#tags').keypress(function(e) { if (e.keyCode == 13 && document.getElementById('t ...

Encountering a Meteor issue during the installation of npm packages

When attempting to install cheerio through npm, I encountered a specific error message. Error: Can't set DOCTYPE here. (Meteor sets <!DOCTYPE html> for you) - line 1, file Similarly, when trying to use jsdom, I faced a parse error. Currently ...

Tips for transferring the id from the url to a php function seamlessly without causing a page refresh

I have a div that includes a button (Book it). When the button is clicked, I want to append the id of the item I clicked on to the current URL. Then, use that id to display a popup box with the details of the clicked item without refreshing the page, as it ...

How can you assign a strokeStyle color to a Canvas using a CSS property?

Our team is currently working on an Angular2 / Ionic 2 project where we have implemented a HTML Canvas element that allows users to draw on it. One challenge we are facing is how to set the Canvas strokeStyle property using a color provided by a CSS style. ...

Display PDF file retrieved from the server using javascript

I am currently working on a web application using JavaScript, jQuery, and Node.js. I need to receive a PDF file from the server and display it in a new browser window. While I believe I have successfully received the file on the client side (the window sh ...

Discovering the value of an item when the editItem function is triggered in jsGrid

Within my jsGrid setup, I have invoked the editItem function in this manner: editItem: function(item) { var $row = this.rowByItem(item); if ($row.length) { console.log('$row: '+JSON ...

What is the process of generating a popup panel without relying on libraries, using JavaScript and CSS?

I'm currently working on creating a popup panel that is centered on the screen with rounded corners (scrollbars are unnecessary) using jQuery min, similar to this example: https://i.stack.imgur.com/0kYO6.png My progress so far: function (package) ...

Is it possible to utilize AngularJS' ng-view and routing alongside jade?

Currently, I am diving into the world of the MEAN stack. I noticed that Express utilizes jade by default, but I decided to experiment with it even though I can easily use html instead. When attempting to route with Angular, like so: ... body div(ng-view ...