this post was submitted on 05 Aug 2023
8 points (100.0% liked)

JavaScript

1972 readers
3 users here now

founded 1 year ago
MODERATORS
[email protected]
[email protected]
[email protected]
8
write to variable with fetch api before rest of script executes (client side) (lemm.ee)
submitted 1 year ago by [email protected] to c/[email protected]
4 comments fedilink hide all child comments
 

How does one fetch some JSON data and save it into a variable and not continue executing the rest of the script until the fetch api has fetch the JSON data?

Here is my code which will return undefined in the console.

var myVar;

fetch("myFile.json")
	.then(res => res.json())
	.then(data => {
	myVar = data;
});
	
console.log(myVar)

//rest of code executes...
you are viewing a single comment's thread
view the rest of the comments
[–] [email protected] 3 points 1 year ago

Your variable myVar doesn't get defined until fetch receives the results, but fetch is an asychronous function, so console.log runs before myVar is defined.

If you want to wait for the results of an asynchronous function before proceeding with execution, you need to use the await keyword:

let myVar = await fetch("myFile.json").then(res => res.json());

console.log(myVar);