JavaScript Async
- Trang trước JS Promise
- Trang tiếp theo Giới thiệu DOM
"async và await giúp việc viết promise dễ dàng hơn"
async để hàm trả về Promise
await để hàm chờ Promise
cú pháp Async
ký tự khóa trước hàm async để hàm trả về promise:
ví dụ
async function myFunction() {
return "Hello";
}
tương đương với:
async function myFunction() {
return Promise.resolve("Hello");
}
Dưới đây là cách sử dụng Promise:
myFunction().then(
function(value) { /* mã khi thành công */ },
function(error) { /* mã khi có lỗi */ }
);
ví dụ
async function myFunction() {
return "Hello";
}
myFunction().then(
function(value) {myDisplayer(value);},
function(error) {myDisplayer(error);}
);
hoặc đơn giản hơn, vì bạn mong đợi giá trị bình thường (phản hồi bình thường, không phải lỗi):
ví dụ
async function myFunction() {
return "Hello";
}
myFunction().then(
function(value) {myDisplayer(value);}
);
cú pháp Await
ký tự khóa trước hàm await để hàm chờ promise:
let value = await promise;
await ký tự khóa chỉ có thể async sử dụng trong hàm
ví dụ
hãy học từ từ cách sử dụng nó.
cơ bản ngữ pháp
async function myDisplay() {
let myPromise = new Promise(function(myResolve, myReject) {
myResolve("Tôi yêu em !!");
});
document.getElementById("demo").innerHTML = await myPromise;
}
myDisplay();
đang chờ quá hạn
async function myDisplay() {
let myPromise = new Promise(function(myResolve, myReject) {
setTimeout(function() { myResolve("Tôi yêu em !!"); }, 3000);
});
document.getElementById("demo").innerHTML = await myPromise;
}
myDisplay();
đang chờ tệp
async function getFile() {
let myPromise = new Promise(function(myResolve, myReject) {
let req = new XMLHttpRequest();
req.open('GET', "mycar.html");
req.onload = function() {
if (req.status == 200) {myResolve(req.response);}
else {myResolve("File not Found");}
};
req.send();
});
document.getElementById("demo").innerHTML = await myPromise;
}
getFile();
Hỗ trợ trình duyệt
ECMAScript 2017 đã giới thiệu từ khóa JavaScript async và await.
Bảng dưới đây liệt kê phiên bản trình duyệt đầu tiên hỗ trợ cả hai:
| Chrome | IE | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome 55 | Edge 15 | Firefox 52 | Safari 11 | Opera 42 |
| Tháng 12 năm 2016 | Tháng 4 năm 2017 | Tháng 3 năm 2017 | Tháng 9 năm 2017 | Tháng 12 năm 2016 |
- Trang trước JS Promise
- Trang tiếp theo Giới thiệu DOM
