Retrieve the object property based on an array of indices

Question

Retrieve the object property based on an array of indices

I am looking to create a function that can retrieve a specific property of an object based on an array of property names

const getObjectProperty = (arr: string[], object: any) {
  // This function should return the desired object property
}

Expected Outcome:

Let's assume we have this Object

const object = {
  id: 1,
  info: {
    name: "my name",
    age: 21,
    home: {
      city: "New York",
      address: "Street Name"
    }
  },
}

getObjectProperty(["info", "name"], object) // Should return "my name"
getObjectProperty(["info", "name", "city"], object) // Should return "New York"
getObjectProperty(["id"], object) // Should return 1
getObjectProperty(["info", "salary"], object) // Should return undefined

What is the best approach to accomplish this task?

javascript arrays json typescript object

Answer 1

Answer №1

To retrieve a property of an object based on an array of property names, you can utilize a for...of loop to iterate through the array and access the corresponding properties of the object.

const properties = ["details", "title"];

const obj = {
 id: 2,
 details: {
 title: "my title",
 category: "example"
 }
};

let result = obj;

for (const prop of properties) {
  result = result[prop];
}

console.log(result); // "my title"

This task can also be achieved using JavaScript's reduce method in a single line of code:

const finalResult= properties.reduce((result, value) => result[value], obj)

Keep in mind that this code assumes the property names in the array exist within the object structure as nested properties. If there are any typos in the property names or if they do not actually exist in the object, the code will produce an error due to a broken chain of properties.

Answer 2

To retrieve a property of an object based on an array of property names, you can utilize a for...of loop to iterate through the array and access the corresponding properties of the object.

const properties = ["details", "title"];

const obj = {
 id: 2,
 details: {
 title: "my title",
 category: "example"
 }
};

let result = obj;

for (const prop of properties) {
  result = result[prop];
}

console.log(result); // "my title"

This task can also be achieved using JavaScript's reduce method in a single line of code:

const finalResult= properties.reduce((result, value) => result[value], obj)

Keep in mind that this code assumes the property names in the array exist within the object structure as nested properties. If there are any typos in the property names or if they do not actually exist in the object, the code will produce an error due to a broken chain of properties.

Answer 3

Answer №2

Remember to utilize the Array reduce method

const arr = ["data", "title"]

const obj = {
  id: 2,
  data: {
    title: "my title",
    age: 30
  }
}

const result = arr.reduce((sum, el) => sum[el], obj)

console.log(result)

Answer 4

Remember to utilize the Array reduce method

const arr = ["data", "title"]

const obj = {
  id: 2,
  data: {
    title: "my title",
    age: 30
  }
}

const result = arr.reduce((sum, el) => sum[el], obj)

console.log(result)

Retrieve the object property based on an array of indices

Answer №1

Answer №2

Similar questions

What is the best way to retrieve a specific value in an array object using JavaScript?

Guide to Including Captions and Spans in a Table

Unable to figure out a method to properly synchronize a vue.js asynchronous function

The illumination in three.js failed to display properly when viewed on Chrome through an Apache server

Is there a way to verify the index in a two-dimensional array in PHP without using a loop?

Evaluate a program to identify prime numbers

Retrieve the complete set of elements within the tree branch by identifying the child ID in PHP Arrauu

Leveraging LESS in an Angular2 component

Saving a local JSON file in Angular 5 using Typescript

How can Angular2 detect when an entity is clicked within a window?

What is the best way to set a button as the default option when it is pressed down?

Stop Gson's deserialization from causing null values for empty strings

JS editing an array in a datatable

Enable an object to be of specific types within a Swagger definition

Sort columns in a MUI datatable

Excluding a Spec File in Your Protractor Configurations

How can you define the types of function arguments when destructuring arguments in TypeScript?

Using Jquery to store input values from within <td> elements in an array

Converting a Microsoft Word document into a JSON file

The true essence of Angular values only comes to light once the view has been updated