js: Is there a more efficient method for looping through a deeply nested object?

Question

js: Is there a more efficient method for looping through a deeply nested object?

If I need to retrieve a list of just the types of cars from this dataset:

let vehicles = [
      {
         magnet: [
            true
         ],
         cars: [
             {
               type: "BMW"
             }
         ],
         name: "Roby"
      },
      {
         magnet: [
            false
         ],
         cars: [
             {
               type: "Mercede"
             }
         ],
         name: "Max"
      }
    ];

Is there a more optimal approach than iterating through the data once like this? I am concerned about assuming that there is only one item in the cars array.

vehicles.map(car => {
   return car.cars[0].type
})

javascript

Answer 1

Answer №1

If you want to efficiently go through all objects and their .cars, the best approach is not to assume that each object only has one car.

An excellent tool for this task is the flatMap method, which can be used in two ways:

const cars = items.flatMap(item => item.cars);
const brands = cars.map(car => car.type);

You can also combine these steps into a single operation by using:

const brands = items.flatMap(item => item.cars.map(car => car.type));

Answer 2

If you want to efficiently go through all objects and their .cars, the best approach is not to assume that each object only has one car.

An excellent tool for this task is the flatMap method, which can be used in two ways:

const cars = items.flatMap(item => item.cars);
const brands = cars.map(car => car.type);

You can also combine these steps into a single operation by using:

const brands = items.flatMap(item => item.cars.map(car => car.type));

js: Is there a more efficient method for looping through a deeply nested object?

Answer №1

Similar questions

Protractor test freezes after attempting to click on an element

How can Swiper efficiently display the next set of x slides?

Navigating to redirected URL within jquery's get() function

Tips for changing an angular variable string before sending it to a PHP function

Tips for avoiding the need to reload a single page application when selecting items in the navigation bar

Rendering images from Laravel's storage folder in a React component

Add a new class to an element located in a separate div using JavaScript

Tips for resolving the error message "cannot read property of undefined"

AngularJS $log - display line numbers

Obtain scope in AngularJS using object ID

Is there a way to easily uncheck all MaterialUI Toggle components with the click of a button or triggering an outside

What are the counterparts of HasValue and .Value in TypeScript?

Explore RxJs DistinctUntilChanged for Deep Object Comparison

export module from the express framework

What methods can I use to locate the circular dependency within my program?

I'm looking to configure @types for a third-party React JavaScript module in order to use it with TypeScript and bundle it with webpack. How can I accomplish this?

Tips for sending an array of "FormData" through ajax and retrieving it in a Laravel controller

What is the best way to send a parameter to a component in Vue.js without including it in the URL during routing?

How can I use AngularJS resource to fetch data from a URL that requires both query parameters and post data?

Steps for declaring multiple variables with the same value