ما هي وظيفة رد الاتصال في JavaScript؟

تقدم هذه المقالة مقدمة موجزة عن مفهوم واستخدام وظائف رد الاتصال في لغة برمجة JavaScript.

الوظائف هي كائنات

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

وظائف رد الاتصال

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

لتوضيح عمليات الاسترجاعات ، لنبدأ بمثال بسيط:

function createQuote(quote, callback){ var myQuote = "Like I always say, " + quote; callback(myQuote); // 2 } function logQuote(quote){ console.log(quote); } createQuote("eat your vegetables!", logQuote); // 1 // Result in console: // Like I always say, eat your vegetables!

في المثال أعلاه ، createQuoteهي دالة الترتيب الأعلى ، والتي تقبل وسيطين ، والثاني هو رد الاتصال. و logQuoteيتم استخدام الدالة لتمرير في وظيفة رد الاتصال بنا. عندما ننفذ createQuoteالوظيفة (1) ، لاحظ أننا لا نلحق الأقواس logQuoteعندما نمررها كوسيطة. هذا لأننا لا نريد تنفيذ وظيفة رد الاتصال الخاصة بنا على الفور ، فنحن نريد ببساطة تمرير تعريف الوظيفة إلى دالة الترتيب الأعلى بحيث يمكن تنفيذها لاحقًا.

أيضًا ، نحتاج إلى التأكد من أنه إذا تم تمرير دالة رد النداء في وسيطات تتوقع ، فإننا نقدم هذه الوسيطات عند تنفيذ رد الاتصال (2) . في المثال أعلاه ، سيكون هذا هو callback(myQuote);البيان ، لأننا نعلم أنه logQuoteيتوقع تمرير اقتباس.

بالإضافة إلى ذلك ، يمكننا تمرير وظائف مجهولة مثل عمليات الاسترجاعات. الاستدعاء أدناه createQuoteسيكون له نفس نتيجة المثال أعلاه:

createQuote("eat your vegetables!", function(quote){ console.log(quote); });

بالمناسبة ، لا يتعين عليك استخدام كلمة "callback" كاسم للحجة الخاصة بك ، فإن Javascript يحتاج فقط إلى معرفة أنه اسم الوسيطة الصحيح. استنادًا إلى المثال أعلاه ، ستتصرف الوظيفة أدناه بنفس الطريقة تمامًا.

function createQuote(quote, functionToCall) { var myQuote = "Like I always say, " + quote; functionToCall(myQuote); }

لماذا استخدام وظائف رد الاتصال؟

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

دعنا نلقي نظرة على مثال يحاكي طلبًا إلى الخادم:

function serverRequest(query, callback){ setTimeout(function(){ var response = query + "full!"; callback(response); },5000); } function getResults(results){ console.log("Response from the server: " + results); } serverRequest("The glass is half ", getResults); // Result in console after 5 second delay: // Response from the server: The glass is half full!

في المثال أعلاه ، نقوم بتقديم طلب وهمي إلى خادم. بعد مرور 5 ثوانٍ ، يتم تعديل الاستجابة ثم getResultsيتم تنفيذ وظيفة رد الاتصال الخاصة بنا . لرؤية هذا في العمل ، يمكنك نسخ / لصق الكود أعلاه في أداة مطور المتصفح الخاص بك وتنفيذه.

أيضًا ، إذا كنت معتادًا بالفعل setTimeout، فأنت تستخدم وظائف رد الاتصال طوال الوقت. إن وسيطة الوظيفة المجهولة التي تم تمريرها إلى setTimeoutاستدعاء الدالة في المثال أعلاه هي أيضًا رد اتصال! لذلك يتم تنفيذ رد الاتصال الأصلي للمثال بالفعل بواسطة رد اتصال آخر. احرص على عدم تداخل عدد كبير جدًا من عمليات الاسترجاعات إذا كان بإمكانك مساعدتها ، حيث يمكن أن يؤدي ذلك إلى شيء يسمى "جحيم رد الاتصال"! كما يوحي الاسم ، ليس من دواعي سروري التعامل معها.