You are on page 1of 9

30/10/23, 00:58 JavaScript Async

 Tutorials  Exercises  Certificates  Services  Search...  Get Certified Sign Up Log in

HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT ❯
MYS
Function Definitions
Function Parameters
Function Invocation
Function Call
Function Apply
Function Bind
Function Closures JavaScript Async
JS Classes
❮ Previous Next ❯
Class Intro
Class Inheritance
Class Static
"async and await make promises easier to write"
JS Async async makes a function return a Promise
JS Callbacks
await makes a function wait for a Promise
JS Asynchronous
JS Promises
JS Async/Await
Async Syntax
JS HTML DOM
DOM Intro The keyword async before a function makes the function return a promise:
DOM Methods
DOM Document
DOM Elements Example
DOM HTML
DOM Forms
https://www.w3schools.com/js/js_async.asp 1/9
30/10/23, 00:58 JavaScript Async

 Tutorials  Exercises 
async function myFunction() {
Certificates 
return "Hello";
Services   Get Certified Sign Up Log in

}
HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT ❯
MYS
Function Definitions
Function Parameters Is the same as:
Function Invocation
function myFunction() {
Function Call
return Promise.resolve("Hello");
Function Apply
}
Function Bind
Function Closures

Here is how to use the Promise:


JS Classes
Class Intro
Class Inheritance
COLOR
myFunction().then(
Class Static PICKER
function(value) { /* code if successful */ },
function(error) { /* code if some error */ }
JS Async );
JS Callbacks
JS Asynchronous
JS Promises 
JS Async/Await Example 
JS HTML DOM async function myFunction() {
DOM Intro return "Hello";
DOM Methods }
myFunction().then(
DOM Document
function(value) {myDisplayer(value);},
DOM Elements
function(error) {myDisplayer(error);}
DOM HTML );
DOM Forms
https://www.w3schools.com/js/js_async.asp 2/9
30/10/23, 00:58 JavaScript Async

Try it Yourself »
 Tutorials  Exercises  Certificates  Services   Get Certified Sign Up Log in

HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT ❯
MYS
Function Definitions Or simpler, since you expect a normal value (a normal response, not an error):
Function Parameters
Function Invocation
Function Call Example
Function Apply
Function Bind async function myFunction() {
Function Closures return "Hello";
}
JS Classes myFunction().then(
function(value) {myDisplayer(value);}
Class Intro
);
Class Inheritance
Class Static
Try it Yourself »

JS Async
JS Callbacks
JS Asynchronous
JS Promises Await Syntax
JS Async/Await
The await keyword can only be used inside an async function.
JS HTML DOM
The await keyword makes the function pause the execution and wait for a resolved
DOM Intro
promise before it continues:
DOM Methods
DOM Document
DOM Elements
DOM HTML
DOM Forms
https://www.w3schools.com/js/js_async.asp 3/9
30/10/23, 00:58 JavaScript Async

 Tutorials  Exercises  Certificates  Services 


let value = await promise;
 Get Certified Sign Up Log in

HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT ❯
MYS
Function Definitions
Function Parameters
Function Invocation
Function Call
Function Apply
Function Bind
Example
Function Closures
Let's go slowly and learn how to use it.

JS Classes
Class Intro Basic Syntax
Class Inheritance
Class Static async function myDisplay() {
let myPromise = new Promise(function(resolve, reject) {
JS Async resolve("I love You !!");
});
JS Callbacks
document.getElementById("demo").innerHTML = await myPromise;
JS Asynchronous
}
JS Promises
JS Async/Await myDisplay();

JS HTML DOM Try it Yourself »


DOM Intro
DOM Methods
DOM Document
DOM Elements
The two arguments (resolve and reject) are pre-defined by JavaScript.
DOM HTML
DOM Forms
https://www.w3schools.com/js/js_async.asp 4/9
30/10/23, 00:58 JavaScript Async

We will not create them, but call one of them when the executor function is ready.
 Tutorials  Exercises  Certificates  Services 
Very often we will not need a reject function.
 Get Certified Sign Up Log in

HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT ❯
MYS
Function Definitions
Function Parameters
Function Invocation
Function Call
Example without reject
Function Apply
async function myDisplay() {
Function Bind
let myPromise = new Promise(function(resolve) {
Function Closures resolve("I love You !!");
});
JS Classes document.getElementById("demo").innerHTML = await myPromise;
Class Intro }

Class Inheritance
myDisplay();
Class Static

JS Async Try it Yourself »

JS Callbacks
JS Asynchronous
JS Promises
JS Async/Await Waiting for a Timeout

JS HTML DOM async function myDisplay() {


let myPromise = new Promise(function(resolve) {
DOM Intro setTimeout(function() {resolve("I love You !!");}, 3000);
DOM Methods });
DOM Document document.getElementById("demo").innerHTML = await myPromise;
DOM Elements }
DOM HTML
DOM Forms
https://www.w3schools.com/js/js_async.asp 5/9
30/10/23, 00:58 JavaScript Async

 Tutorials  Exercises  myDisplay();


Certificates  Services   Get Certified Sign Up Log in

HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT ❯
MYS
Function Definitions Try it Yourself »
Function Parameters
Function Invocation
Function Call
Function Apply Waiting for a File
Function Bind
Function Closures async function getFile() {
let myPromise = new Promise(function(resolve) {
JS Classes let req = new XMLHttpRequest();
req.open('GET', "mycar.html");
Class Intro
req.onload = function() {
Class Inheritance if (req.status == 200) {
Class Static resolve(req.response);
} else {
JS Async resolve("File not Found");
}
JS Callbacks
};
JS Asynchronous
req.send();
JS Promises
});
JS Async/Await document.getElementById("demo").innerHTML = await myPromise;
}
JS HTML DOM
DOM Intro getFile();

DOM Methods
DOM Document Try it Yourself »
DOM Elements
DOM HTML
DOM Forms
https://www.w3schools.com/js/js_async.asp 6/9
30/10/23, 00:58 JavaScript Async

 Tutorials  Browser
Exercises CertificatesSupport
 Services   Get Certified Sign Up Log in

HTML CSS JAVASCRIPT SQL PYTHON


ECMAScript JAVA
2017 introduced PHPJavaScript
the HOW TO W3.CSS
keywords async Cand C++
await .C# BOOTSTRAP REACT ❯
MYS
Function Definitions
Function Parameters The following table defines the first browser version with full support for both:
Function Invocation
Function Call
Function Apply
Function Bind
Function Closures Chrome 55 Edge 15 Firefox 52 Safari 11 Opera 42

Dec, 2016 Apr, 2017 Mar, 2017 Sep, 2017 Dec, 2016
JS Classes
Class Intro
Class Inheritance
Class Static
❮ Previous Log in to track progress Next ❯
JS Async
JS Callbacks
JS Asynchronous
JS Promises
JS Async/Await

JS HTML DOM
DOM Intro
DOM Methods
DOM Document
DOM Elements
 SPACES UPGRADE NEWSLETTER

DOM HTML
DOM Forms
https://www.w3schools.com/js/js_async.asp 7/9
30/10/23, 00:58 JavaScript Async

 Tutorials  Exercises  Certificates 


GET CERTIFIED
Services 
REPORT ERROR
 Get Certified Sign Up Log in

HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT ❯
MYS
Function Definitions
Function Parameters Top Tutorials Top References
Function Invocation
HTML Tutorial HTML Reference
Function Call CSS Tutorial CSS Reference
JavaScript Tutorial JavaScript Reference
Function Apply
How To Tutorial SQL Reference
Function Bind SQL Tutorial Python Reference
Python Tutorial W3.CSS Reference
Function Closures W3.CSS Tutorial Bootstrap Reference
Bootstrap Tutorial PHP Reference
PHP Tutorial HTML Colors
JS Classes Java Tutorial Java Reference
C++ Tutorial Angular Reference
Class Intro jQuery Tutorial jQuery Reference

Class Inheritance Top Examples Get Certified


Class Static HTML Examples HTML Certificate
CSS Examples CSS Certificate
JavaScript Examples JavaScript Certificate
JS Async How To Examples Front End Certificate
SQL Examples SQL Certificate
JS Callbacks Python Examples Python Certificate
W3.CSS Examples PHP Certificate
JS Asynchronous Bootstrap Examples jQuery Certificate
JS Promises PHP Examples Java Certificate
Java Examples C++ Certificate
JS Async/Await XML Examples C# Certificate
jQuery Examples XML Certificate

JS HTML DOM
DOM Intro
DOM Methods     FORUM ABOUT
DOM Document W3Schools is optimized for learning and training. Examples might be simplified to improve reading and
learning.
DOM Elements Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full
DOM HTML correctness
of all content. While using W3Schools, you agree to have read and accepted our terms of use, cookie and
DOM Forms
https://www.w3schools.com/js/js_async.asp 8/9
30/10/23, 00:58 JavaScript Async
privacy policy.

 Tutorials  Exercises  Certificates  Services   Get Certified


Copyright 1999-2023 by Refsnes Data. All Rights Reserved. W3Schools is Powered by W3.CSS.
Sign Up Log in

HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT ❯
MYS
Function Definitions
Function Parameters
Function Invocation
Function Call
Function Apply
Function Bind
Function Closures

JS Classes
Class Intro
Class Inheritance
Class Static

JS Async
JS Callbacks
JS Asynchronous
JS Promises
JS Async/Await

JS HTML DOM
DOM Intro
DOM Methods
DOM Document
DOM Elements
DOM HTML
DOM Forms
https://www.w3schools.com/js/js_async.asp 9/9

You might also like