"إذا أراد العامل أن يؤدي عمله بشكل جيد، فعليه أولاً أن يشحذ أدواته." - كونفوشيوس، "مختارات كونفوشيوس. لو لينجونج"
الصفحة الأمامية > برمجة > البرمجة غير المتزامنة في جافا سكريبت: عمليات الاسترجاعات مقابل الوعود مقابل عدم المزامنة/الانتظار

البرمجة غير المتزامنة في جافا سكريبت: عمليات الاسترجاعات مقابل الوعود مقابل عدم المزامنة/الانتظار

تم النشر بتاريخ 2024-07-31
تصفح:650

Asynchronous Programming in JavaScript: Callbacks vs Promises vs Async/Await

تعد البرمجة غير المتزامنة جانبًا رئيسيًا في JavaScript يسمح للمطورين بتنفيذ طلبات الشبكة الطويلة وعمليات الملفات والمهام الأخرى التي تستغرق وقتًا طويلاً دون حظر سلسلة المحادثات الرئيسية. وهذا يضمن أن تظل التطبيقات سريعة الاستجابة وسهلة الاستخدام. توفر JavaScript ثلاث طرق رئيسية للتعامل مع العمليات غير المتزامنة: عمليات الاسترجاعات والوعود وعدم المزامنة/الانتظار. في هذه المقالة، سوف نتعمق في كل من هذه الطرق، ونستكشف تركيبها، واستخدامها، والاختلافات من خلال أمثلة مفصلة.

جدول المحتويات

  1. مقدمة إلى البرمجة غير المتزامنة
  2. عمليات الاسترجاعات
    • التركيب والمثال
    • المميزات والعيوب
  3. وعود
    • التركيب والمثال
    • الوعود المتسلسلة
    • المميزات والعيوب
  4. غير متزامن/انتظار
    • التركيب والمثال
    • معالجة الأخطاء
    • المميزات والعيوب
  5. المقارنة وأفضل الممارسات
  6. خاتمة

مقدمة إلى البرمجة غير المتزامنة

في JavaScript، يمكن التعامل مع العمليات التي تستغرق وقتًا حتى تكتمل، مثل جلب البيانات من الخادم، أو قراءة الملفات، أو إجراء العمليات الحسابية، بشكل غير متزامن. وهذا يعني أنه أثناء انتظار اكتمال العملية، يمكن لمحرك JavaScript الاستمرار في تنفيذ مهام أخرى. وهذا أمر بالغ الأهمية لإنشاء تجارب مستخدم فعالة وسلسة في تطبيقات الويب.

عمليات الاسترجاعات

بناء الجملة والمثال

تعد عمليات الاسترجاعات إحدى أقدم الطرق للتعامل مع العمليات غير المتزامنة في JavaScript. رد الاتصال هو ببساطة دالة تم تمريرها كوسيطة إلى دالة أخرى، والتي سيتم تنفيذها بمجرد اكتمال العملية غير المتزامنة.

function fetchData(callback) {
    setTimeout(() => {
        callback("Data fetched!");
    }, 1000);
}

function displayData(data) {
    console.log(data);
}

fetchData(displayData);

في المثال أعلاه، يحاكي fetchData عملية غير متزامنة باستخدام setTimeout. بعد ثانية واحدة، تقوم باستدعاء الدالة DisplayData، وتمرير البيانات التي تم جلبها كوسيطة.

المميزات والعيوب

مزايا:

  • بسيطة ومباشرة للمهام الصغيرة.
  • يوفر طريقة لتنفيذ التعليمات البرمجية بعد اكتمال عملية غير متزامنة.

سلبيات:

  • يمكن أن يؤدي إلى "جحيم رد الاتصال" عندما تتداخل عدة عمليات غير متزامنة، مما يجعل قراءة التعليمات البرمجية وصيانتها صعبة.
  • معالجة الأخطاء مرهقة، حيث يجب إدارة الأخطاء في كل رد اتصال.

وعود

بناء الجملة والمثال

تم تقديم الوعود في ES6 (ECMAScript 2015) لمعالجة المشكلات المرتبطة بعمليات الاسترجاعات. يمثل الوعد عملية لم تكتمل بعد ولكنها متوقعة في المستقبل. يمكن أن يكون في إحدى الحالات الثلاث: معلق أو مستوفي أو مرفوض.

function fetchData() {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve("Data fetched!");
        }, 1000);
    });
}

fetchData()
    .then(data => {
        console.log(data);
    })
    .catch(error => {
        console.error("Error:", error);
    });

في هذا المثال، تقوم fetchData بإرجاع وعد يتم حله بـ "تم جلب البيانات!" بعد 1 ثانية. يتم استخدام الطريقةthen لمعالجة القيمة التي تم حلها، ويتم استخدام طريقة الالتقاط لمعالجة أي أخطاء.

وعود التسلسل

يمكن ربط الوعود لتنفيذ سلسلة من العمليات غير المتزامنة بالتسلسل.

function fetchData() {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve("Data fetched!");
        }, 1000);
    });
}

function processData(data) {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve(`${data} Processed!`);
        }, 1000);
    });
}

fetchData()
    .then(data => {
        console.log(data);
        return processData(data);
    })
    .then(processedData => {
        console.log(processedData);
    })
    .catch(error => {
        console.error("Error:", error);
    });

في هذا المثال، يتم استدعاء بيانات العملية بعد fetchData، ويتم التعامل مع النتائج بالتسلسل باستخدام ثم.

المميزات والعيوب

مزايا:

  • يتجنب جحيم رد الاتصال من خلال السماح بتسلسل العمليات غير المتزامنة.
  • يوفر معالجة مدمجة للأخطاء باستخدام خاصية الالتقاط.
  • يحسن إمكانية قراءة التعليمات البرمجية وقابلية صيانتها.

سلبيات:

  • لا يزال من الممكن أن يصبح الأمر معقدًا مع استدعاءات متعددة متداخلة.
  • معالجة الأخطاء في السلسلة يمكن أن تكون غير تافهة.

غير متزامن/انتظار

بناء الجملة والمثال

Async/Await، الذي تم تقديمه في ES2017، يوفر طريقة أكثر إيجازًا وقابلية للقراءة لكتابة تعليمات برمجية غير متزامنة باستخدام Promises. يتم استخدام الكلمة الأساسية غير المتزامنة لتحديد وظيفة غير متزامنة، ويتم استخدام الكلمة الأساسية "انتظار" لإيقاف التنفيذ مؤقتًا حتى يتم حل الوعد.

async function fetchData() {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve("Data fetched!");
        }, 1000);
    });
}

async function displayData() {
    const data = await fetchData();
    console.log(data);
}

displayData();

في هذا المثال، تعتبر DisplayData وظيفة غير متزامنة تنتظر اكتمال عملية جلب البيانات قبل تسجيل البيانات.

معالجة الأخطاء

يمكن معالجة الأخطاء باستخدام Async/Await باستخدام كتل المحاولة/الالتقاط.

async function fetchData() {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            reject("Failed to fetch data!");
        }, 1000);
    });
}

async function displayData() {
    try {
        const data = await fetchData();
        console.log(data);
    } catch (error) {
        console.error("Error:", error);
    }
}

displayData();

هنا، إذا فشل جلب البيانات، فسيتم اكتشاف الخطأ وتسجيله بواسطة كتلة الالتقاط.

المميزات والعيوب

مزايا:

  • يبسط التعليمات البرمجية غير المتزامنة، مما يجعلها تبدو أشبه بالكود المتزامن.
  • يعزز إمكانية قراءة التعليمات البرمجية وقابلية الصيانة.
  • يبسط معالجة الأخطاء باستخدام كتل المحاولة/الالتقاط.

سلبيات:

  • يتطلب فهم الوعود نظرًا لأن Async/Await مبني عليها.
  • لا يزال جديدًا نسبيًا، لذا قد لا تدعمه بعض البيئات بشكل كامل.

المقارنة وأفضل الممارسات

مقارنة

  • عمليات الاسترجاعات: مناسبة للمهام البسيطة غير المتزامنة ذات المستوى الواحد ولكنها يمكن أن تؤدي إلى جحيم رد الاتصال في السيناريوهات المعقدة.
  • الوعود: تحسين إمكانية القراءة وسهولة الإدارة، مما يسمح بتسلسل العمليات غير المتزامنة. معالجة الأخطاء المضمنة باستخدام أداة الالتقاط.
  • Async/Await: يوفر الطريقة الأكثر قابلية للقراءة والصيانة لكتابة تعليمات برمجية غير متزامنة. يبسط معالجة الأخطاء ويبدو وكأنه رمز متزامن.

أفضل الممارسات

  • استخدم Async/Await لمعظم السيناريوهات التي تحتاج فيها إلى التعامل مع العمليات غير المتزامنة. فهو يوفر أفضل سهولة القراءة والبساطة.
  • استخدم الوعود عندما تحتاج إلى تنفيذ عمليات متعددة غير متزامنة بالتسلسل أو عند استخدام المكتبات التي ترجع الوعود.
  • تجنب عمليات الاسترجاعات إلا في حالة العمل باستخدام تعليمات برمجية قديمة أو عند التعامل مع مهام غير متزامنة بسيطة جدًا.

خاتمة

تعد البرمجة غير المتزامنة في JavaScript ضرورية لبناء تطبيقات سريعة الاستجابة وفعالة. يتيح فهم الاختلافات بين عمليات الاسترجاعات والوعود وعدم المزامنة/الانتظار للمطورين اختيار الأداة المناسبة لحالة الاستخدام الخاصة بهم. في حين أن عمليات الاسترجاعات هي أبسط أشكال التعامل مع العمليات غير المتزامنة، إلا أنها يمكن أن تؤدي إلى تعليمات برمجية فوضوية. تقدم الوعود نهجًا أكثر تنظيماً، لكن Async/Await يوفر الحل الأكثر أناقة وقابلية للقراءة. ومن خلال اتباع أفضل الممارسات وفهم هذه الأدوات، يمكن للمطورين كتابة تعليمات برمجية غير متزامنة نظيفة وقابلة للصيانة وفعالة.

بيان الافراج تم إعادة إنتاج هذه المقالة على: https://dev.to/itsshaikhaj/asynchronous-programming-in-javascript-callbacks-vs-promises-vs-asyncawait-690?1 إذا كان هناك أي انتهاك، يرجى الاتصال بـ [email protected] لحذفه
أحدث البرنامج التعليمي أكثر>

تنصل: جميع الموارد المقدمة هي جزئيًا من الإنترنت. إذا كان هناك أي انتهاك لحقوق الطبع والنشر الخاصة بك أو الحقوق والمصالح الأخرى، فيرجى توضيح الأسباب التفصيلية وتقديم دليل على حقوق الطبع والنشر أو الحقوق والمصالح ثم إرسالها إلى البريد الإلكتروني: [email protected]. سوف نتعامل مع الأمر لك في أقرب وقت ممكن.

Copyright© 2022 湘ICP备2022001581号-3