الدوال: التصريحات والتعابير والدوال السهمية
عرّف الدوال بثلاث طرق، وافهم الرفع، واستخدم المعاملات والقيم المعادة، واكتب دوال سهمية موجزة.
الدوال: التصريحات والتعابير والدوال السهمية درس مجاني في Frontend Academy على CoddyKit. هذا هو الدرس 3 من أصل 4. يمكنك قراءة الدرس كاملاً أدناه مجاناً — ثم تمرن عليه مباشرة في المتصفح باستخدام محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7. هذا الدرس جزء من مسار التعلم في Frontend Academy، وتقدمك يتزامن عبر الويب وتطبيق CoddyKit. تتضمن دورة Frontend Academy 4 دروس في المجموع.
ما الدوال؟
الدوال كتل شيفرة قابلة لإعادة الاستخدام. تستقبل مدخلات (معاملات)، وتنّفذ منطقًا، ويمكنها اختياريًا إرجاع مخرجات. والدوال في JavaScript قيم من الدرجة الأولى، إذ يمكن إسنادها إلى المتغيرات وتمريرها كوسائط وإرجاعها من دوال أخرى.
تصريحات الدوال
ينشئ تصريح الدالة دالةً مسماة باستخدام الكلمة المفتاحية function. وتُرفع التصريحات، لذا يمكنكم استدعاء الدوال قبل ظهورها في الشيفرة.
function greet(name) {
return `Hello, ${name}!`;
}
// Can call before declaration due to hoisting:
console.log(greet('Alice')); // 'Hello, Alice!'تعبيرات الدوال
يسند تعبير الدالة دالةً إلى متغير. ولا يتم رفعه، إذ يُرفع المتغير على أنه undefined. ويمكن أن تكون تعبيرات الدوال مجهولة الاسم أو مسماة.
const multiply = function(a, b) {
return a * b;
};
console.log(multiply(3, 4)); // 12
// Named function expression (name useful in stack traces):
const factorial = function fact(n) {
return n <= 1 ? 1 : n * fact(n - 1);
};دوال الأسهم
دوال الأسهم صياغة مختصرة قُدّمت في ES6. ولا تمتلك this خاصًا بها، بل ترث this من النطاق المحيط. وهي مناسبة جدًا لدوال الاستدعاء اللاحق والدوال القصيرة.
// Standard arrow:
const add = (a, b) => a + b;
// Single parameter (no parens needed):
const double = n => n * 2;
// No parameters:
const greet = () => 'Hello!';
// Multi-line body needs {} and return:
const process = (x) => {
const result = x * 2;
return result + 1;
};المعاملات والوسائط
المعاملات هي الأسماء المدرجة في تعريف الدالة. أما الوسائط فهي القيم التي تُمرَّر عند استدعاء الدالة. ويُتجاهل وجود وسائط إضافية، بينما تكون الوسائط المفقودة undefined.
function info(name, age) {
console.log(`${name} is ${age}`);
}
info('Alice', 30); // 'Alice is 30'
info('Bob'); // 'Bob is undefined'المعاملات الافتراضية
تتيح ES6 تعيين قيم افتراضية للمعاملات. وتُستخدم القيمة الافتراضية عندما تكون الوسيطة undefined، بما في ذلك حالة عدم تمريرها إطلاقًا.
function greet(name = 'World') {
return `Hello, ${name}!`;
}
console.log(greet()); // 'Hello, World!'
console.log(greet('Alice')); // 'Hello, Alice!'عبارة return
تُرجع الدوال undefined افتراضيًا. استخدموا return لإخراج قيمة. وتنتهي الدالة عند أول return تصادفه، ولا تُنفَّذ الشيفرة اللاحقة.
function divide(a, b) {
if (b === 0) return null; // early return
return a / b;
}
console.log(divide(10, 2)); // 5
console.log(divide(10, 0)); // nullمعاملات rest
يجمع معامل rest ...args جميع الوسائط المتبقية في مصفوفة. ويجب أن يكون آخر معامل. وهو يحل محل كائن arguments القديم في الشيفرة الحديثة.
function sum(...numbers) {
return numbers.reduce((total, n) => total + n, 0);
}
console.log(sum(1, 2, 3, 4)); // 10الدوال كقيم (من الدرجة الأولى)
يمكن تخزين الدوال في المتغيرات، وتمريرها إلى دوال أخرى كوسائط (دوال الاستدعاء اللاحق)، وإرجاعها من الدوال. ويتيح ذلك أنماطًا قوية مثل أساليب المصفوفات ومستمعات الأحداث.
const numbers = [3, 1, 4, 1, 5];
const sorted = numbers.sort((a, b) => a - b); // callback
console.log(sorted); // [1, 1, 3, 4, 5]الدوال النقية
تُرجع الدالة النقية المخرجات نفسها للمدخلات نفسها، ولا تملك تأثيرات جانبية (مثل تغيير DOM أو إجراء طلبات شبكة أو تغيير المتغيرات العامة). ومن السهل اختبار الدوال النقية وتصحيحها وفهم سلوكها.
// Pure:
const add = (a, b) => a + b;
// Impure (side effect: mutates external state):
let total = 0;
function addToTotal(n) { total += n; }تعبيرات الدوال المستدعاة فورًا (IIFE)
تُنفّذ IIFE فور تعريفها. وقد استُخدمت تاريخيًا لإنشاء نطاق خاص. وأصبحت الحاجة إليها أقل اليوم بفضل الوحدات والنطاق الكتلي، لكنها لا تزال تظهر في قواعد الشيفرة الأقدم.
(function () {
const secret = 'hidden';
console.log('IIFE ran');
})();
// secret is not accessible hereتحقق سريع
أي العبارات التالية صحيحة بشأن دوال الأسهم؟
مراجعة: الدوال في JavaScript
تُرفع تصريحات الدوال. أما تعبيرات الدوال ودوال الأسهم فلا تُرفع. دوال الأسهم موجزة ولا تمتلك this خاصًا بها. استخدموا المعاملات الافتراضية للتعامل مع الوسائط المفقودة. الدوال قيم من الدرجة الأولى، لذا مرروها بحرية.
الأسئلة الشائعة
هل درس «الدوال: التصريحات والتعابير والدوال السهمية» مجاني؟
نعم — نص درس «الدوال: التصريحات والتعابير والدوال السهمية» كامل متاح مجاناً هنا على الويب. لتمرينه بشكل تفاعلي (محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7) وفتح باقي دورة Frontend Academy، انتقل إلى CoddyKit PRO. تتضمن دورة Frontend Academy 4 دروس في المجموع.
ماذا ستتعلم في «الدوال: التصريحات والتعابير والدوال السهمية»؟
عرّف الدوال بثلاث طرق، وافهم الرفع، واستخدم المعاملات والقيم المعادة، واكتب دوال سهمية موجزة. تتمرن على Frontend Academy مع أكواد عملية تشغلها مباشرة في المتصفح، ومدرس ذكاء اصطناعي متاح 24/7 يجيب على أسئلتك أثناء عملك.
هل أحتاج إلى خبرة سابقة لأبدأ Frontend Academy؟
لا تُشترط خبرة سابقة. Frontend Academy على CoddyKit منظم للمبتدئين حتى المتقدمين، لذا يمكنك البدء من هنا أو من البداية والتقدم بسرعتك الخاصة. هذا هو الدرس 3 من أصل 4.
كم من الوقت يستغرق درس «الدوال: التصريحات والتعابير والدوال السهمية»؟
معظم دروس CoddyKit تستغرق حوالي 5–10 دقائق. كل منها موجز وتفاعلي، لذا تحرز تقدماً مستمراً وتستأنف من حيث توقفت عبر الويب والتطبيق.
هل يمكنني كتابة وتشغيل أكواد في درس Frontend Academy هذا؟
نعم. كل درس في Frontend Academy يتضمن محرر أكواد مدمج، لذا تكتب وتشغل أكواداً حقيقية مباشرة في متصفحك وتحصل على تعليقات فورية من الذكاء الاصطناعي — بدون إعداد محلي.
جميع الدروس في هذه الدورة
- المتغيرات: let وconst وvar والنطاق
- أنواع البيانات: string وnumber وboolean وnull وundefined
- الدوال: التصريحات والتعابير والدوال السهمية
- تدفق التحكم: if وelse وswitch وfor وwhile