انتقل إلى محتوى الدرس
الدرس 107
دورة جافا سكريبت

JS Async/Await

في هذا الدرس سوف نتعرف علي ال async وال await وهما يعملان بنفس الطريقة التي يعمل بها ال Promise والتي سبق وتعرفنا عليها في الدرس السابق  ولكن بطريقة اسهل 

أقسام الدرس
3
الأمثلة
9
اللغة
العربية
تاريخ النشر
غير محدد
المشاهدات
3,136
محتوى الدرس
في هذا الدرس 3تصفّح المواضيع

JS Async/Await

استخدام ال async/await  يسهل عملية ال Promise التي تعلمناها في الدرس السابق  

  • async : تستخدم في أنشاء دالة تقوم بأرجاع Promise 
  • await : تستخدم في أنشاء دالة تنتظر تنفيذ ال Promise 
JS Async/Await

Async Syntax

عند كتابة كلمة async قبل اسم الدالة كما في المثال التالي تجعل الدالة تقوم بأرجاع Promise بشكل تلقائي

HTML
async function myFunction() {
  return "Hello";
}

المثال التالي هو نفسه المثال السابق لأن ال async تقوم بأرجاع Promise بشكل تلقائي

HTML
async function myFunction() {
  return Promise.resolve("Hello");
}

والشكل التالي يوضح طريقة استخدام ال Promise وسبق وقمنا بشرحها في الدروس السابقة

HTML
myFunction().then(
  function(value) { /* code if successful */ },
  function(error) { /* code if some error */ }
);

Example

HTML
async function myFunction() {
  return "Hello";
}
myFunction().then(
  function(value) {myDisplayer(value);},
  function(error) {myDisplayer(error);}
);

Example

HTML
async function myFunction() {
  return "Hello";
}
myFunction().then(
  function(value) {myDisplayer(value);}
);

Await Syntax

كتابة كلمة "await" قبل الدالة يجعلها تنتظر Promise من ال async وبناءا علي النتيجة يتم تنفيذ الدالة التي استخدام معها await

HTML
let value = await promise;

Example

HTML
async function myDisplay() {
  let myPromise = new Promise(function(resolve, reject) {
    resolve("I love You !!");
  });
  document.getElementById("demo").innerHTML = await myPromise;
}

myDisplay();

Example without reject

HTML
async function myDisplay() {
  let myPromise = new Promise(function(resolve) {
    resolve("I love You !!");
  });
  document.getElementById("demo").innerHTML = await myPromise;
}

myDisplay();

Waiting for a Timeout

HTML
async function myDisplay() {
  let myPromise = new Promise(function(resolve) {
    setTimeout(function() {resolve("I love You !!");}, 3000);
  });
  document.getElementById("demo").innerHTML = await myPromise;
}

myDisplay();

مشاركة

هل كان هذا الدرس مفيدًا؟

جارٍ تحميل الآراء…