Getting the first array from a fetch promise is a process that involves accessing the

Question

Getting the first array from a fetch promise is a process that involves accessing the

When working with a fetch promise, I need to return a JSON object that contains all of my data. The challenge is that I am not sure what the object name will be. What I do know is that there will always be one object present.

Below is an example of my code where I am able to retrieve the necessary data when I know the object name (in this case, "foo"):

  return fetch(endPoint)
    .then(res => res.json())
    .then(res => res.foo)
    .then(res => console.log(res))

The response I expect would resemble this:

{
    "foo": [
        "bar1",
        "bar2",
        "bar3"
    ]
}

However, if the response looks like this:

{
    "goo": [
        "bar1",
        "bar2",
        "bar3"
    ]
}

My code would fail. How can I modify my code to ensure it will work regardless of the object name?

javascript arrays json object ecmascript-6

Answer 1

Answer №1

Utilize Object.values:

const obj = {
  "foo": [
    "bar1",
    "bar2",
    "bar3"
  ]
};

const [foo] = Object.values(obj);
console.log(foo);

The code above makes use of destructuring, which is a shortcut for the following:

const foo = Object.values(obj)[0];

Previous syntax:

var obj = {
    "foo": [
        "bar1",
        "bar2",
        "bar3"
    ]
};

var foo = obj[Object.keys(obj)[0]];
console.log(foo);

Answer 2

Utilize Object.values:

const obj = {
  "foo": [
    "bar1",
    "bar2",
    "bar3"
  ]
};

const [foo] = Object.values(obj);
console.log(foo);

The code above makes use of destructuring, which is a shortcut for the following:

const foo = Object.values(obj)[0];

Previous syntax:

var obj = {
    "foo": [
        "bar1",
        "bar2",
        "bar3"
    ]
};

var foo = obj[Object.keys(obj)[0]];
console.log(foo);

Answer 3

Answer №2

If you want to access the first element of an object, you can utilize Object.values().

const obj = {"foo": ["bar1","bar2", "bar3"]}
const res = Object.values(obj)[0]
console.log(res)

For a more concise method, you can employ Array Destructuring.

const obj = {"foo": ["bar1","bar2", "bar3"]}
const [res] = Object.values(obj)
console.log(res)

Answer 4

If you want to access the first element of an object, you can utilize Object.values().

const obj = {"foo": ["bar1","bar2", "bar3"]}
const res = Object.values(obj)[0]
console.log(res)

For a more concise method, you can employ Array Destructuring.

const obj = {"foo": ["bar1","bar2", "bar3"]}
const [res] = Object.values(obj)
console.log(res)

Getting the first array from a fetch promise is a process that involves accessing the

Answer №1

Answer №2

Similar questions

The never-ending nightmare of acquiring a Facebook Graph token

Can a Stylus and Node.js with Express project utilize a local image?

JavaScript - Issue with retrieving object properties accurately

Send an ArrayList to jQuery Flot

When using jQuery's `.click()` method on an element to collapse it with the 'show' parameter set to false, the disabling action will only take effect after the document

Decoding Azure JSON Responses with C#

converting a JSON string into an object using C#

Sending a multitude of variables using strings, evaluating them through various functions, and incorporating a variety of methods

When integrating react-hook-form with Material-UI TextField in a form, an error occurs stating that "TypeError: e.target is undefined" when

Neglecting the error message for type assignment in the Typescript compiler

Output the JSON string retrieved from a specified URL

Display the changing value at the beginning of the drop-down menu

"Experience the power of Angular.js through seamless animations created by blending the capabilities

Can assigning "NSMutableArray" to "NSArray" result in incompatible pointer types?

Animate a box moving continuously from the right to the left using jQuery

Encounter issue with async function in produce using Immer

Retrieve an array from a JSON file obtained from a web request using Python

Showing the image as a backdrop while scrolling through text

Skipping beforeRouteLeave in VueJS

What is the method for retrieving the hashed classname set by CSS Modules within a functional react component?