JavaScript Asinkron
"async dan menunggu membuat janji lebih mudah untuk ditulis"
async membuat fungsi mengembalikan Janji
menunggu membuat fungsi menunggu Janji
Sintaks Asinkron
Kata kunci async
sebelum suatu fungsi membuat fungsi mengembalikan janji:
Contoh
async function myFunction() {
return "Hello";
}
Sama dengan:
function myFunction() {
return Promise.resolve("Hello");
}
Berikut cara menggunakan Promise:
myFunction().then(
function(value) { /* code if successful */ },
function(error) { /* code if some error */ }
);
Contoh
async function myFunction() {
return "Hello";
}
myFunction().then(
function(value) {myDisplayer(value);},
function(error) {myDisplayer(error);}
);
Atau lebih sederhana, karena Anda mengharapkan nilai normal (respons normal, bukan kesalahan):
Contoh
async function myFunction() {
return "Hello";
}
myFunction().then(
function(value) {myDisplayer(value);}
);
Sintaks Tunggu
Kata kunci await
sebelum fungsi membuat fungsi menunggu janji:
let value = await promise;
Kata await
kunci hanya dapat digunakan di dalam suatu
async
fungsi.
Contoh
Ayo pelan-pelan dan pelajari cara menggunakannya.
Sintaks Dasar
async function myDisplay() {
let myPromise = new Promise(function(resolve, reject) {
resolve("I love You !!");
});
document.getElementById("demo").innerHTML = await myPromise;
}
myDisplay();
Dua argumen (menyelesaikan dan menolak) telah ditentukan sebelumnya oleh JavaScript.
Kami tidak akan membuatnya, tetapi memanggil salah satunya ketika fungsi eksekutor sudah siap.
Sangat sering kita tidak membutuhkan fungsi penolakan.
Contoh tanpa penolakan
async function myDisplay() {
let myPromise = new Promise(function(resolve) {
resolve("I love You !!");
});
document.getElementById("demo").innerHTML = await myPromise;
}
myDisplay();
Menunggu Waktu Habis
async function myDisplay() {
let myPromise = new Promise(function(resolve) {
setTimeout(function() {resolve("I love You !!");}, 3000);
});
document.getElementById("demo").innerHTML = await myPromise;
}
myDisplay();
Menunggu File
async function getFile() {
let myPromise = new Promise(function(resolve) {
let req = new XMLHttpRequest();
req.open('GET', "mycar.html");
req.onload = function() {
if (req.status == 200) {
resolve(req.response);
} else {
resolve("File not Found");
}
};
req.send();
});
document.getElementById("demo").innerHTML = await myPromise;
}
getFile();
Dukungan Peramban
ECMAScript 2017 memperkenalkan kata kunci JavaScript
async
dan await
.
Tabel berikut mendefinisikan versi browser pertama dengan dukungan penuh untuk keduanya:
Chrome 55 | Edge 15 | Firefox 52 | Safari 11 | Opera 42 |
Dec, 2016 | Apr, 2017 | Mar, 2017 | Sep, 2017 | Dec, 2016 |