Retrieve a dynamic value from an object

Question

Retrieve a dynamic value from an object

Is it possible to dynamically pass a context from the server to the client so that the client can retrieve a value from an object more efficiently?

For example, the server sends an object with a key-value pair like this:

"booking__validating_carrier__iata": "Cia"

.

The key

booking__validating_carrier__iata

can be translated into an array

['booking', 'validating_carrier', 'iata']

. The goal is to access the value

order['booking']['validating_carrier']['iata']

or

order.booking.validating_carrier.iata

I'm trying to figure out a way to access the object without hardcoding the indexing levels. One approach I came up with is:

if(arr.length === 1) {
  order[arr[0]]
} else if(arr.length === 2) {
  order[arr[0]][arr[1]]
} else if(arr.length === 3) {
  order[arr[0]][arr[1]][arr[2]]
} else if(arr.length === 4) {
  order[arr[0]][arr[1]][arr[2]]
} else if(arr.length === 5) {
  order[arr[0]][arr[1]][arr[2]][arr[3]]
}

Is there a more efficient way to loop through the array length to access nested properties of the object?

Thank you!

javascript arrays json for-loop object

Answer 1

Answer №1

To simplify the array, you can utilize the reduce method and set order as the starting point. The nested object will then act as the accumulator during each iteration.

arr.reduce((acc, k) => acc[k] || {}, order)

Check out this code snippet:

const nested = {
  "1": {
    "1.1": {
      "1.1.1": "3 level nesting"
    },
    "1.2": "2 level nesting"
  }
}

const getValue = (order, arr) => arr.reduce((acc, k) => acc[k] || {}, order)

console.log( getValue(nested, ["1", "1.1", "1.1.1"]) )
console.log( getValue(nested, ["1", "1.2"]) )

Answer 2

To simplify the array, you can utilize the reduce method and set order as the starting point. The nested object will then act as the accumulator during each iteration.

arr.reduce((acc, k) => acc[k] || {}, order)

Check out this code snippet:

const nested = {
  "1": {
    "1.1": {
      "1.1.1": "3 level nesting"
    },
    "1.2": "2 level nesting"
  }
}

const getValue = (order, arr) => arr.reduce((acc, k) => acc[k] || {}, order)

console.log( getValue(nested, ["1", "1.1", "1.1.1"]) )
console.log( getValue(nested, ["1", "1.2"]) )

Answer 3

Answer №2

To accomplish this task, one approach is to use a recursive function. This function will continue iterating until either the array runs out of data fields or the object no longer contains nested objects that match the array fields.

const arr = ['category', 'subcategory', 'item'];

const data = {
  category: {
    subcategory: "example"
  }
}

const recursiveFunction = (element, array, index) => {
  if(array[index] !== undefined && element[array[index]] !== undefined) {
    return recursiveFunction(element[array[index]], array, ++index);
  } else {
    return element;
  }
}

console.log(recursiveFunction(data, arr, 0));

Alternatively, you could opt for a for loop:

const arr = ['category', 'subcategory', 'item'];

const data = {
  category: {
    subcategory: "example"
  }
}

let finalResult = data;
for(field of arr) {
  if(finalResult[field] !== undefined) {
    finalResult = finalResult[field];
  }
}

console.log(finalResult);

Answer 4

To accomplish this task, one approach is to use a recursive function. This function will continue iterating until either the array runs out of data fields or the object no longer contains nested objects that match the array fields.

const arr = ['category', 'subcategory', 'item'];

const data = {
  category: {
    subcategory: "example"
  }
}

const recursiveFunction = (element, array, index) => {
  if(array[index] !== undefined && element[array[index]] !== undefined) {
    return recursiveFunction(element[array[index]], array, ++index);
  } else {
    return element;
  }
}

console.log(recursiveFunction(data, arr, 0));

Alternatively, you could opt for a for loop:

const arr = ['category', 'subcategory', 'item'];

const data = {
  category: {
    subcategory: "example"
  }
}

let finalResult = data;
for(field of arr) {
  if(finalResult[field] !== undefined) {
    finalResult = finalResult[field];
  }
}

console.log(finalResult);

Retrieve a dynamic value from an object

Answer №1

Answer №2

Similar questions

Transform MONGODB BSON data into JSON using Bash

Information released by JavaScript through AJAX and JSON

Angular and Spring are producing a 415 Unsupported Media Type error

Is it beneficial to vary the time between function calls when utilizing setInterval in JavaScript?

create a function that returns JSX in React

Get the JS file by tapping the download button, and access the

Styling Challenges with CSS/AngularJS Accordion in Footer

Transferring data from a class method to a React component

Utilizing SetInterval for dynamically changing the CSS background image URL

Setting the default date format in dayjs: A quick guide

Disabling specific time slots in the mat select functionality

Exploring ways to check async calls within a React functional component

Managing images in JavaScript while conserving memory

Tips on conducting a statistical analysis without having to wait for the completion of an AJAX response

Activate the Bootstrap Jquery/Ajax inline editing feature by simply clicking on the Edit button

Change the type of an object to a different type

Error in setting cookies using Javascript document.cookie on iOS with cordova-plugin-ionic-webview

Install package specifically for a single project

What is the process for passing an Object from JavaScript to an Action class in Struts 2?

Guide to verifying a value within a JSON object in Ionic 2