Turning a JSON dot string into an object reference in JavaScript: A simple guide

Question

Turning a JSON dot string into an object reference in JavaScript: A simple guide

Having a JSON object labeled test with values like this: {"items":[{"name":"test"}]}, I need a way to apply the string items[0].name to it in order to search for a specific value (test.items[0].name). Currently, my only idea is to create a function that parses square brackets and dots. Is there an alternative method, possibly involving eval (though I prefer to avoid it)?

To clarify, I have a JSON object where the details are not important. What matters is being able to query the object using a string, such as theobject.items[0]. The challenge lies in the fact that the query string (e.g., items[0]) is unknown - consider it user input stored as a string (var thisIsAString = "items[0]"). So, I require a way to append this query string to theobject in order to retrieve the value at theobject.items[0].

javascript json

Answer 1

Answer №1

function findValue(object, pathName) {

  pathName = pathName.split('.');
  var arrayPattern = /(.+)\[(\d+)\]/;
  for (var index = 0; index < pathName.length; index++) {
    var matchArray = arrayPattern.exec(pathName[index]);
    if (matchArray) {
      object = object[matchArray[1]][parseInt(matchArray[2])];
    } else {
      object = object[pathName[index]];
    }
  }

  return object;
}

var attribute = findValue(dataObject, 'products[0].price');

Answer 2

function findValue(object, pathName) {

  pathName = pathName.split('.');
  var arrayPattern = /(.+)\[(\d+)\]/;
  for (var index = 0; index < pathName.length; index++) {
    var matchArray = arrayPattern.exec(pathName[index]);
    if (matchArray) {
      object = object[matchArray[1]][parseInt(matchArray[2])];
    } else {
      object = object[pathName[index]];
    }
  }

  return object;
}

var attribute = findValue(dataObject, 'products[0].price');

Answer 3

Answer №2

...When working with JSON data, it's important to differentiate between strings and objects. If you can access the data using dot/bracket notation, then it's a JavaScript object/array...

If you are handling a pure string like this:

'{"name":"string","array":[0,1,2]}'

You will need to use JSON.parse on it;

var json_string = '{"name":"string","array":[0,1,2]}',
    js_obj = JSON.parse(json_string);

js_obj.name; // "string"
js_obj.array; // [0,1,2]
js_obj.array[1]; // 1

If the data is not just a string but an object/array with nested objects/arrays, you can simply do:

myObj.items[0].name = items[0].name;

If it turns out to be a string, parse it with .parse and carry out the same operations as demonstrated above. And if you need to convert it back to a string for server transmission, utilize JSON.stringify like so:

var json_string = JSON.stringify(js_obj);

Your modified JSON string is now ready.

In case you require compatibility with older versions of Internet Explorer (such as IE < 8), consider downloading json2.js by Douglas Crockford and conditionally adding it to your page if window.JSON is unavailable.

Answer 4

...When working with JSON data, it's important to differentiate between strings and objects. If you can access the data using dot/bracket notation, then it's a JavaScript object/array...

If you are handling a pure string like this:

'{"name":"string","array":[0,1,2]}'

You will need to use JSON.parse on it;

var json_string = '{"name":"string","array":[0,1,2]}',
    js_obj = JSON.parse(json_string);

js_obj.name; // "string"
js_obj.array; // [0,1,2]
js_obj.array[1]; // 1

If the data is not just a string but an object/array with nested objects/arrays, you can simply do:

myObj.items[0].name = items[0].name;

If it turns out to be a string, parse it with .parse and carry out the same operations as demonstrated above. And if you need to convert it back to a string for server transmission, utilize JSON.stringify like so:

var json_string = JSON.stringify(js_obj);

Your modified JSON string is now ready.

In case you require compatibility with older versions of Internet Explorer (such as IE < 8), consider downloading json2.js by Douglas Crockford and conditionally adding it to your page if window.JSON is unavailable.

Turning a JSON dot string into an object reference in JavaScript: A simple guide

Answer №1

Answer №2

Similar questions

Tips for designing a search bar using Angular

Retrieve the current URL of an IFRAME

Managing numerous range sliders in a Django form

The Array map function is not displaying the list within a React component that is based on a Class

Load a script in a specific div using React

Implement a Loop that Generates Buttons with Popups Using jQuery Mobile

Having trouble parsing JSON elements separately

Mandrill: Issue with merge_vars functionality

Creating PHP functions that return a JSON string when invoked - a simple guide

Dynamic Form Submission - Displaying Notifications for Success and Failure

Struggling to grasp the concept of PHP LZW decompression function within JSend framework

Issue with triggering ReactJS onClick function accurately

Is it possible to override values set in the constructor(props) in React? If not, what is the best way to set defaults that can be overwritten later?

Begin a SeleniumWebDriver session after Google Chrome has been launched beforehand

Unable to display toast notification in React/MUI/Typescript project

Handling Slow Json Response in C# with MVVM Pattern

Unable to execute PHP alongside a JavaScript event listener

"Encountered a 'NextAuth expression cannot be called' error

What is the best way to resize a div located below a dynamic div in order to occupy the available space?

Navigating through and extracting data from an object in JavaScript