Efficiently Extract and Append Unknown Nested JSON Values into an Array using JavaScript

Question

Efficiently Extract and Append Unknown Nested JSON Values into an Array using JavaScript

It's puzzling why I'm finding this challenging. It seems like there should be a solution using Lodash or a similar tool.

My object is structured like this:

  { "fdjkafdajkfasfjkdaslj": {
      "-LMUD-2APhiSLkEtVbM": {
        "profileName": "bob",
            "profilePic": "www.profilepic.com",
            "score": 73,
            "teamName": "lzs"
        }
    }
  }

I won't know the first two keys in the structure, like "fdjkafdajkfasfjkdaslj" or "-LMUD-2APhiSLkEtVbM".

All I need to do is extract these key values and store them in an array.

       "profileName": "bob",
        "profilePic": "www.profilepic.com",
        "score": 73,
        "teamName": "lzs"

What would be the best approach to achieve this in JavaScript (specifically React.js)? I thought about using Lodash but haven't found a suitable solution yet. Most of my searches for extracting nested Key/Value data from JSON suggest using a path, but in this case, I don't have that information. The only certainty I have is the consistent object structure with two unknown keys preceding the actual key/value data.

javascript json

Answer 1

Answer №1

If the object in question contains only one key, you can utilize Object.keys()

const data = [];

const obj = { "fdjkafdajkfasfjkdaslj" {
      "-LMUD-2APhiSLkEtVbM": {
        "profileName": "bob",
            "profilePic": "www.profilepic.com",
            "score": 73,
            "teamName": "lzs"
        }
    }
  };
  
  const outerObj = obj[Object.keys(obj)[0]];
  
  const item = outerObj[Object.keys(outerObj)[0]];
  
  data.push(item);

Answer 2

If the object in question contains only one key, you can utilize Object.keys()

const data = [];

const obj = { "fdjkafdajkfasfjkdaslj" {
      "-LMUD-2APhiSLkEtVbM": {
        "profileName": "bob",
            "profilePic": "www.profilepic.com",
            "score": 73,
            "teamName": "lzs"
        }
    }
  };
  
  const outerObj = obj[Object.keys(obj)[0]];
  
  const item = outerObj[Object.keys(outerObj)[0]];
  
  data.push(item);

Answer 3

Answer №2

To solve this problem, consider utilizing the Object.values method.

const extractedValue = Object.values( Object.values( strangeObject )[0] )[0]

finalArray.push(extractedValue)

Answer 4

To solve this problem, consider utilizing the Object.values method.

const extractedValue = Object.values( Object.values( strangeObject )[0] )[0]

finalArray.push(extractedValue)

Answer 5

Answer №3

While parsing a JSON string, you can easily locate specific information:

var json = '{"fdjkafdajkfasfjkdaslj":{"-LMUD-2APhiSLkEtVbM":{"profileName":"bob","profilePic":"www.profilepic.com","score":73,"teamName":"lzs"}}}';
var obj;
JSON.parse(json, (key, value) => {
  if (value.profileName) {
    obj = value;
}
});

console.log(obj);

Answer 6

While parsing a JSON string, you can easily locate specific information:

var json = '{"fdjkafdajkfasfjkdaslj":{"-LMUD-2APhiSLkEtVbM":{"profileName":"bob","profilePic":"www.profilepic.com","score":73,"teamName":"lzs"}}}';
var obj;
JSON.parse(json, (key, value) => {
  if (value.profileName) {
    obj = value;
}
});

console.log(obj);

Efficiently Extract and Append Unknown Nested JSON Values into an Array using JavaScript

Answer №1

Answer №2

Answer №3

Similar questions

Adding an eventListener to the display style of a div in React: A step-by-step guide

having difficulty applying a border to the popup modal

Return an array with only emails included

Failure in querying with Mongo's $lookup results in an empty array

Arrange objects based on the most recent addition using Vue JS

Utilize Hardhat and NPM to distinguish between unit tests and integration tests efficiently

Assign the default value of a Vue prop to the options of its parent component

Can someone please guide me on how to transfer information from a material ui datagrid Row to a form input?

How come running `npm install <folder>` results in installing different dependencies compared to `npm install lib`?

Limit DerbyJS to re-rendering specific DOM elements

Is it advisable to consider yarn.lock as a binary file when using git?

Find matches between elements based on their names or alt tags and retrieve the associated data

My Redux reducer is being overridden by changes made using setState or .map() within my React component

Does JSON have a special reserved key for identifying the time?

JQuery .click Event doesn't center elements even with transform-origin adjustment

The URL overwrites the Ajax transfer type

What steps should I take to resolve the issue with this error message: Error: listen EADDRINUSE

How can I utilize React to pull information from the Google Taxonomy API?

Step by step guide on rotating a plane with texture by 90 degrees

Does using .detach() eliminate any events?