Navigating through arrays to access nested objects

Question

Navigating through arrays to access nested objects

Currently, I am attempting to retrieve a specific field within a nested array using the following code:

var array1 = [];

const data =  { [userId]: [{
             id: id,
             name: fullName,
             email: userEmail },
            ],
          };

array1.push(data);

After printing this using

console.log("index 0: ", array1[0]);

, the output is:

index 0:  {
  buMqSZpEaKZABffDGNs5jzVK36Y2: [
    {
      id: '65',
      name: 'nameTest',
      email: '<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="aec3d7cbd6c3cfc7c2eec9c3cfc7c280cdc1c3">[email protected]</a>'
    }
  ]
}

However, I am trying to figure out how to access the information within the userId, such as userId.name and locate a specific userId like "aePoUZpkUnlAOMNBGNs5ynMD36L1" in array1 to display its details similar to activeSockets[0]. or using indexOf(). Whenever I attempt to access the fields inside, it often results in a

Cannot read property '' of undefined

error. Any guidance on this issue would be highly appreciated.

javascript arrays

Answer 1

Answer №1

To discover the object associated with the user ID within an array, you can utilize the following code:

var array1 = [];

var data =  { ['ABC123']: [{
     id: 1,
     name: 'john',
     email: '<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="62080d0a0c4c060d07220c0d0f030b0e4c010d0f">[email protected]</a>'
      },
    ],
  };

array1.push(data);

let userId = 'ABC123';

let userObj = array1.find((x)=> x[userId] !== undefined);

if(userObj) {
    let userData = userObj[userId][0];
    console.log(`name: ${userData.name}`);
    console.log(userData);
}
else {
    console.log(`user ${userId} not found.`);
}

In most cases, utilizing a value as a property name is not common practice, but rather using it as a property value in objects.

This approach simplifies the use of find or filter.

For instance:

var array1 = [];

array1.push({
         userid : 'ABC123',
         id: 1,
         name: 'john',
         email: '<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="ddb7b2b5b3f3b9b2b89db3b2b0bcb4b1f3beb2b0">[email protected]</a>'
      });

let userId = 'ABC123';
let userData = array1.find((x)=> x.userid === userId);

if(userData) {
    console.log(`name: ${userData.name}`);
    console.log(userData);
}
else {
    console.log(`user ${userId} not found.`);
}

Answer 2

To discover the object associated with the user ID within an array, you can utilize the following code:

var array1 = [];

var data =  { ['ABC123']: [{
     id: 1,
     name: 'john',
     email: '<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="62080d0a0c4c060d07220c0d0f030b0e4c010d0f">[email protected]</a>'
      },
    ],
  };

array1.push(data);

let userId = 'ABC123';

let userObj = array1.find((x)=> x[userId] !== undefined);

if(userObj) {
    let userData = userObj[userId][0];
    console.log(`name: ${userData.name}`);
    console.log(userData);
}
else {
    console.log(`user ${userId} not found.`);
}

In most cases, utilizing a value as a property name is not common practice, but rather using it as a property value in objects.

This approach simplifies the use of find or filter.

For instance:

var array1 = [];

array1.push({
         userid : 'ABC123',
         id: 1,
         name: 'john',
         email: '<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="ddb7b2b5b3f3b9b2b89db3b2b0bcb4b1f3beb2b0">[email protected]</a>'
      });

let userId = 'ABC123';
let userData = array1.find((x)=> x.userid === userId);

if(userData) {
    console.log(`name: ${userData.name}`);
    console.log(userData);
}
else {
    console.log(`user ${userId} not found.`);
}

Navigating through arrays to access nested objects

Answer №1

Similar questions

Enhancing bar chart presentation with text in d3

Optimal method for storing large arrays of numbers in localStorage using JavaScript

Ways to enhance radio imagery selection?

AngularJS Time Range Selector: A Slider Solution

"Capturing the essence of your online presence: The

Select a Date: Input for Date Selection

The resolveMX function in Google Cloud Functions is encountering issues when trying to process a list of domains

Iterating over an object and inserting values into a JavaScript object using the ascending count as the identifier

Javascript generates a mapping of values contained within an array

Error with Chakra UI and React Hook Form mismatched data types

Altering the DOM directly within the componentDidMount() lifecycle method without needing to use

Angularjs 2 Error: Unable to access the 'infos' property of an undefined object using the Http Client

Struggling to maintain context with axios in React despite diligent use of arrow functions

Using onchange within an onchange event will not function as intended

Updating token using an Ajax request in a PHP webpage

Is it possible to import SVG files and inline them in Angular?

Using two loops/arrays in JavaScript to generate a rating score

Tips for verifying the "truthiness" of an object, removing any falsy values, and making changes to the object

Having trouble with some JS and Jquery codes not functioning properly in IE until the page is refreshed a few times. Any suggestions on how to fix this issue?

The React useEffect hook runs whenever there is a change in the state