الدوال
الحلقات تجيب عن متى يتكرر العمل. الدوال تجيب عن سؤال آخر: أين تحفظ كتلة عمل لتشغّلها لاحقاً بالاسم؟ الدالة وصفة باسم. تعرّفها مرة. وتستدعيها كلما احتجت تلك الخطوات. النسخ واللصق يتراجع؛ الاسم يبقى.
ما هي الدالة؟
في JavaScript تعلن الدالة بكلمة function واسم وأقواس () وجسم داخل { }. لا يُنفَّذ شيء من الجسم حتى تستدعي الدالة — اكتب الاسم ثم (). فكّر: «غلّف الخطوات، ثم اضغط تشغيل.»
أجزاء الدالة
📊 تشريح الدالة
| الجزء | الدور | متى يناسب |
|---|---|---|
كلمة function |
تبدأ الإعلان | «هنا تأتي وصفة باسم» |
| الاسم | به تستدعي لاحقاً | sayHi، showTotal — أفعال واضحة تساعد |
() بعد الاسم |
موقع الاستدعاء / لاحقاً المدخلات | حتى () الفارغة تعني «نفّذ الآن» |
جسم { } |
الخطوات عند كل استدعاء | طباعة، حساب، تحديث الصفحة |
استدعاء name() |
يشغّل الجسم الآن | إعادة استخدام بلا إعادة كتابة الجسم |
التعريف وحده يخزّن الوصفة. الاستدعاء يشغّلها. إن لم تستدعِ يظل الجسم صامتاً — أمر طبيعي في اللغة، لا خلل.
function sayHi() {
console.log("Hi");
}
sayHi();
عرّف ثم استدعِ
الأسطر الثلاثة الأولى تعرّف sayHi. السطر الأخير يستدعيها. يجب أن ترى Hi في وحدة التحكم. بلا sayHi(); الدالة موجودة لكنها لا تعمل.
function beep() {
console.log("beep");
}
beep();
beep();
أعد استخدام جسم واحد
تعريف واحد واستدعاءان — تُطبع beep مرتين. هذه الفكرة: اكتب الخطوات مرة، وشغّلها كلما احتاجت القصة ذلك الصوت. تغيير الجسم لاحقاً يحدّث كل مواقع الاستدعاء بهذا الاسم.
function showReady() {
console.log("loading");
console.log("ready");
}
showReady();
الجسم قد يحوي عدة خطوات
باستدعاء واحد يعمل السطران بالترتيب: loading ثم ready. الدالة ليست سطراً واحداً — ضع المهمة الصغيرة كاملة داخل الأقواس المعقوفة.
function greetCity() {
let city = "Tehran";
let line = "Hello from " + city;
console.log(line);
}
greetCity();
العمل المحلي يبقى داخل الوصفة
city وline يعيشان داخل greetCity. كل استدعاء يبني الرسالة ويطبع Hello from Tehran. لا تحتاج هذه الأسماء خارج الدالة في هذا النمط — الزناد هو الاستدعاء.
function fillOut() {
let box = document.getElementById("out");
box.textContent = "Function ran";
}
fillOut();
شغّل عملاً للصفحة
نفس فكرة دروس DOM: اعثر على العنصر، عيّن textContent. تغليفه في دالة يتيح لزر أو مؤقت أو سكربت استدعاء fillOut() عندما يجب تحديث الصفحة — اسم واحد، مهمة واحدة.
أظهر دالة على الصفحة
عرّف دالة تكتب سطراً قصيراً في فقرة، ثم استدعِها من السكربت ليرى الزائر النتيجة.
<!DOCTYPE html>
<html>
<head>
<title>functions — page</title>
</head>
<body>
<p id="msg">…</p>
<script>
function showMsg() {
let box = document.getElementById("msg");
box.textContent = "Hello from a function";
}
showMsg();
</script>
</body>
</html>
الصفحة تعرض Hello from a function. جسم showMsg كتب على DOM؛ الاستدعاء في الأسفل ضغط التشغيل. غيّر النص، حدّث الصفحة، واقرأ السطر الجديد. الدرس التالي يتعمّق في المعاملات — قيم تمرّرها داخل الأقواس عند الاستدعاء.
جرّبها بنفسك
- أعلن
function hello()تطبع"hello"واستدعِها مرة. - استدعِ نفس الدالة ثانية دون إعادة كتابة الجسم.
- اصنع دالة يطبع جسمها كلمتين مختلفتين بالترتيب.
- داخل دالة ابنِ سلسلة بـ
letواطبعها. - اكتب دالة تجعل
#outيساوي"ok"(أو استخدم id العرض في HTML). - في عرض HTML غيّر نص الرسالة فقط، حدّث، واقرأ الفقرة.
أخطاء شائعة
- تعريف الدالة ونسيان استدعائها بـ
() - كتابة
sayHiبلا()— تذكر الاسم ولا تشغّل الجسم - نسخ ولصق نفس الأسطر بدل استدعاء دالة واحدة مرتين
- وضع العمل خارج
{ }وتوقع أن اسم الدالة «يملكه» - خلط هذا الدرس بالمعاملات و
return— تلك لاحقاً؛ هنا التعريف والاستدعاء
خلاصة
- الدالة تعلّب الخطوات تحت اسم
- أعلن بـ
function name() { … } - استدعِ بـ
name()لتشغيل الجسم - جسم واحد واستدعاءات كثيرة — إعادة استخدام
- الجسم قد يحوي عدة أوامر وعملاً محلياً بـ
let - تحديث الصفحة يناسب دالة تستدعيها عند الحاجة
- التالي: المعاملات — مرّر قيماً عند الاستدعاء
🧠 اختبر معرفتك
اختبر معرفتك
تحدى نفسك مع هذا الاختبار التفاعلي واكتشف مدى فهمك للموضوع
📝 التعليمات
- اقرأ كل سؤال بعناية
- اختر أفضل إجابة لكل سؤال
- يمكنك إعادة الاختبار عدة مرات كما تريد
- سيتم عرض تقدمك في الأعلى