JSFiddle - React, Tailwind, and code Playground

HTML

Console.log(F12 button)

JavaScript

var x = 1;
var delay = 1000;

function update_x(){	//обновить существующий x
	x += 1;				//увиличить на 1
	return x;			//и вернуть
}

async function f(delay) {

	let promise = new Promise((resolve, reject) => {
		setTimeout(() => resolve( ( update_x() ) ), delay)	//вернуть новый x через время
	});

	return await promise;	// ждать "новый x" пока promise не будет "resolved", и ВЕРНУТЬ ЕГО, этот x, из функции - только потом;
}

console.log("start... x = ", x); //изначальный x

//ждать выполнения медленной функции f и показать "новый x"...

//console.log(await f());							// 	хрень какая-то, если в скрипте:		Uncaught SyntaxError: missing ) after argument list.
													//	А если ввести в консоли - работает.

(async () => {return (console.log("x =", x, ", modified x =", await f(delay)));})()	//	а вот так - работает и в скрипте и в консоли.


setTimeout(
	function(){
		console.log("now x = ", x);	//показать обновленный x
	},
	2*delay						//уже после всего этого...
);