76 lines
6.0 KiB
Markdown
76 lines
6.0 KiB
Markdown
|
---
|
|||
|
title: Callback Functions
|
|||
|
localeTitle: وظائف رد الاتصال
|
|||
|
---
|
|||
|
تقدم هذه المقالة مقدمة موجزة لمفهوم واستخدام وظائف معاودة الاتصال في لغة برمجة 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` أقواس `logQuote` عندما `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);
|
|||
|
}
|
|||
|
`
|
|||
|
|
|||
|
## لماذا استخدام Callbacks؟
|
|||
|
|
|||
|
معظم الوقت نقوم بإنشاء البرامج والتطبيقات التي تعمل بطريقة **متزامنة** . بعبارة أخرى ، تبدأ بعض عملياتنا فقط بعد أن تكتمل العمليات السابقة. في كثير من الأحيان عندما نطلب بيانات من مصادر أخرى ، مثل واجهة برمجة تطبيقات خارجية ، لا نعرف دائمًا _متى_ سيتم عرض بياناتنا مرة أخرى. في هذه الحالات ، نريد أن ننتظر الرد ، لكننا لا نريد دائمًا أن يتم إيقاف التطبيق بالكامل بينما يتم جلب بياناتنا. هذه الحالات هي حيث وظائف رد الاتصال تأتي في متناول اليدين.
|
|||
|
|
|||
|
دعونا نلقي نظرة على مثال يحاكي طلب إلى الخادم:
|
|||
|
|
|||
|
`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` المذكورة أعلاه بمثابة استدعاء أيضًا! لذلك يتم تنفيذ رد الاتصال الأصلي للمثال بواسطة رد اتصال آخر. احرص على عدم وضع عدد كبير من عمليات الاسترجاعات إذا كان بإمكانك مساعدتك ، لأن ذلك يمكن أن يؤدي إلى شيء يسمى "callback hell"! كما يوحي الاسم ، فإنه ليس من الفرح التعامل معه.
|