جافا سكريبت Async
"عدم التزامن والانتظار اجعل الوعود أسهل في الكتابة"
غير المتزامن يجعل الدالة ترجع وعدًا
انتظار يجعل وظيفة انتظار الوعد
النحو غير المتزامن
الكلمة الأساسية async
قبل الوظيفة تجعل الوظيفة ترجع وعدًا:
مثال
async function myFunction() {
return "Hello";
}
بالضبط مثل:
function myFunction() {
return Promise.resolve("Hello");
}
إليك كيفية استخدام الوعد:
myFunction().then(
function(value) { /* code if successful */ },
function(error) { /* code if some error */ }
);
مثال
async function myFunction() {
return "Hello";
}
myFunction().then(
function(value) {myDisplayer(value);},
function(error) {myDisplayer(error);}
);
أو أبسط ، بما أنك تتوقع قيمة عادية (استجابة عادية وليست خطأ):
مثال
async function myFunction() {
return "Hello";
}
myFunction().then(
function(value) {myDisplayer(value);}
);
في انتظار بناء الجملة
الكلمة الأساسية await
قبل الوظيفة تجعل الوظيفة تنتظر وعدًا:
let value = await promise;
لا يمكن await
استخدام الكلمة الأساسية إلا داخل
async
دالة.
مثال
لنبدأ ببطء ونتعلم كيفية استخدامه.
النحو الأساسي
async function myDisplay() {
let myPromise = new Promise(function(resolve, reject) {
resolve("I love You !!");
});
document.getElementById("demo").innerHTML = await myPromise;
}
myDisplay();
تم تعريف الوسيطتين (الحل والرفض) مسبقًا بواسطة JavaScript.
لن نقوم بإنشائها ، ولكن نتصل بأحدها عندما تكون وظيفة المنفذ جاهزة.
في كثير من الأحيان لن نحتاج إلى وظيفة الرفض.
مثال دون رفض
async function myDisplay() {
let myPromise = new Promise(function(resolve) {
resolve("I love You !!");
});
document.getElementById("demo").innerHTML = await myPromise;
}
myDisplay();
في انتظار مهلة
async function myDisplay() {
let myPromise = new Promise(function(resolve) {
setTimeout(function() {resolve("I love You !!");}, 3000);
});
document.getElementById("demo").innerHTML = await myPromise;
}
myDisplay();
في انتظار ملف
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();
دعم المتصفح
قدم ECMAScript 2017 كلمات JavaScript الأساسية
async
و await
.
يحدد الجدول التالي إصدار المستعرض الأول مع دعم كامل لكليهما:
Chrome 55 | Edge 15 | Firefox 52 | Safari 11 | Opera 42 |
Dec, 2016 | Apr, 2017 | Mar, 2017 | Sep, 2017 | Dec, 2016 |