Javascript Fetch API - How to save output to variable as an Object (not the Promise)

Question

Please, how can I save output of fetch to a variable - to be able to work with it as with an object?

Here is the code:

var obj; fetch("url", {   method: "POST",   body: JSON.stringify({     "filterParameters": {       "id": 12345678     }   }),   headers: {"content-type": "application/json"},   //credentials: 'include' }) .then(res => res.json()) .then(console.log) 

The final console.log will show an object. But when I tried to save it to variable .then(res => obj = res.json()) than the console.log(obj) will not hold the Object, but the Promise.

Any idea please, how to turn it into an Object saved in the variable?

Answer 1

For a modern async/await approach refer to @PrathameshMore's answer below

---

.json() is an async method (it returns a Promise itself), so you have to assign the parsed value in the next .then()

var obj;    fetch('https://jsonplaceholder.typicode.com/posts/1')    .then(res => res.json())    .then(data => obj = data)    .then(() => console.log(obj))

Answer 2

Instead of storing in a variable, create a function that will return data, and then store it in a variable. So It can accessible in your whole file.

async fetchExam(id) {         try {             const response = await fetch(`/api/exams/${id}`, {                 method: 'GET',                 credentials: 'same-origin'             });             const exam = await response.json();             return exam;         } catch (error) {             console.error(error);         }     } 

Then call that function to get data

async renderExam(id) {         const exam = await fetchExam(id);         console.log(exam); } 

Update

With the current version of Node.js v14.3.0 support Top-Level async-await

import axios from 'axios';  const response = await axios('https://quote-garden.herokuapp.com/api/v3/quotes/random'); console.log(response.data); 

Running this file using node --harmony-top-level-await top-level-async-await.js

Output

More details: https://medium.com/@pprathameshmore/top-level-await-support-in-node-js-v14-3-0-8af4f4a4d478