الدوال في JavaScript — دليل شامل Functions 2026

في المقال السابق، تعلمت الحلقات وكيف تكرر المهام. لكن ماذا لو أردت تنفيذ نفس المهمة في أماكن مختلفة من البرنامج؟ هنا تأتي الدوال (Functions) — وهي حجر الأساس في تنظيم الكود.

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

ما هي الدالة؟

الدالة هي كتلة من الكود لها اسم، تؤدي مهمة محددة، ويمكن استدعاؤها عدة مرات.

تشبيه بسيط: تخيل أن الدالة هي "آلة" — تدخل فيها مدخلات (معاملات)، وتخرج منها نتيجة.

مثال:

function greet() {
  console.log("مرحباً بالعالم!");
}

greet();  // استدعاء الدالة
greet();  // استدعاء مرة أخرى

النتيجة:

مرحباً بالعالم!
مرحباً بالعالم!

شرح:

• function: كلمة مفتاحية لتعريف الدالة.
• greet: اسم الدالة.
• (): قوسان للمعاملات (فارغة هنا).
• { ... }: جسم الدالة (الكود الذي ينفذ).
• greet();: استدعاء الدالة.

لماذا نحتاج الدوال؟

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

مثال: بدون دوال vs مع دوال

بدون دوال:

console.log("مرحباً أحمد");
console.log("مرحباً محمد");
console.log("مرحباً علي");
console.log("مرحباً فاطمة");

مع دوال:

function greet(name) {
  console.log("مرحباً " + name);
}

greet("أحمد");
greet("محمد");
greet("علي");
greet("فاطمة");

المعاملات (Parameters)

المعاملات هي مدخلات الدالة. تُمرر بين القوسين ().

function greet(name) {
  console.log("مرحباً " + name);
}

greet("أحمد");   // مرحباً أحمد
greet("محمد");   // مرحباً محمد

شرح:

• name: معامل (parameter) — متغير داخل الدالة.
• "أحمد": قيمة (argument) — ما تمرره عند الاستدعاء.

عدة معاملات:

function introduce(name, age) {
  console.log("اسمي " + name + " وعمري " + age);
}

introduce("أحمد", 25);

النتيجة:

اسمي أحمد وعمري 25

قيم افتراضية للمعاملات:

function greet(name = "زائر") {
  console.log("مرحباً " + name);
}

greet();          // مرحباً زائر
greet("أحمد");    // مرحباً أحمد

القيم المرجعة (Return)

الدالة يمكن أن تُرجع قيمة باستخدام return.

function add(a, b) {
  return a + b;
}

const result = add(5, 3);
console.log(result);  // 8

الفرق بين console.log و return:

• console.log: تطبع في الطرفية (للعرض فقط).
• return: تُرجع قيمة يمكن استخدامها في الكود.

// بدون return:
function add1(a, b) {
  console.log(a + b);
}

const x = add1(5, 3);  // يطبع 8، لكن x = undefined

// مع return:
function add2(a, b) {
  return a + b;
}

const y = add2(5, 3);  // y = 8

⚠️ مهم: بعد return، تتوقف الدالة عن التنفيذ.

function test() {
  return "أول";
  console.log("هذا لن ينفذ");  // ❌ لا يظهر
}

console.log(test());  // "أول"

أنواع الدوال

1. Function Declaration — التعريف التقليدي

function greet(name) {
  return "مرحباً " + name;
}

ميزتها: يمكن استدعاؤها قبل تعريفها (hoisting).

2. Function Expression — تعبير دالة

const greet = function(name) {
  return "مرحباً " + name;
};

الفرق: لا يمكن استدعاؤها قبل التعريف.

3. Arrow Function — الدالة السهمية

طريقة حديثة ومختصرة:

const greet = (name) => {
  return "مرحباً " + name;
};

// أو أقصر (إذا كان سطراً واحداً):
const greet = (name) => "مرحباً " + name;

ميزاتها:

• أقصر.
• لا تحتاج function.
• إذا كان السطر واحداً، يمكن حذف {} و return.

مثال:

const add = (a, b) => a + b;
console.log(add(5, 3));  // 8

4. دالة بدون معاملات:

const greet = () => "مرحباً!";
console.log(greet());  // مرحباً!

جدول مقارنة بين أنواع الدوال

النوع	الصيغة	الاستخدام
Declaration	function name() {}	الطريقة التقليدية
Expression	const name = function() {}	عند تمرير دالة كقيمة
Arrow	const name = () => {}	الطريقة الحديثة

نطاق المتغيرات (Scope)

المتغيرات داخل الدالة لا يمكن الوصول إليها من خارجها.

function test() {
  const message = "داخل الدالة";
  console.log(message);  // يعمل
}

test();
console.log(message);  // ❌ خطأ: message is not defined

الفرق:

• المتغيرات المحلية (Local): داخل الدالة فقط.
• المتغيرات العامة (Global): خارج أي دالة.

const global = "عام";

function test() {
  const local = "محلي";
  console.log(global);  // ✅ يعمل
  console.log(local);   // ✅ يعمل
}

test();
console.log(global);  // ✅ يعمل
console.log(local);   // ❌ خطأ

الدوال المُرجَعة (Callbacks)

يمكن تمرير دالة كمعامل لدالة أخرى:

function greet(name, callback) {
  console.log("مرحباً " + name);
  callback();
}

function sayGoodbye() {
  console.log("إلى اللقاء!");
}

greet("أحمد", sayGoodbye);

النتيجة:

مرحباً أحمد
إلى اللقاء!

الاستخدام: شائع جداً في JavaScript (مثل map, filter, setTimeout).

الدوال المجهولة (Anonymous Functions)

دالة بدون اسم، تُستخدم كقيمة:

const greet = function(name) {
  return "مرحباً " + name;
};

console.log(greet("أحمد"));  // مرحباً أحمد

أو مع setTimeout:

setTimeout(function() {
  console.log("بعد ثانيتين");
}, 2000);

الدوال العودية (Recursion)

الدالة التي تستدعي نفسها:

function factorial(n) {
  if (n === 0 || n === 1) {
    return 1;
  }
  return n * factorial(n - 1);
}

console.log(factorial(5));  // 120

شرح:

• factorial(5) = 5 × factorial(4)
• factorial(4) = 4 × factorial(3)
• ...
• factorial(1) = 1

⚠️ تحذير: تأكد من وجود حالة توقف (base case)، وإلا ستحدث حلقة لا نهائية.

تمرير المعاملات: by Value vs by Reference

بالقيمة (Value): للمتغيرات البسيطة (رقم، نص، منطقي).

function changeValue(x) {
  x = 100;
}

let num = 5;
changeValue(num);
console.log(num);  // 5 (لم يتغير)

بالمرجع (Reference): للكائنات والمصفوفات.

function changeArray(arr) {
  arr.push(4);
}

let numbers = [1, 2, 3];
changeArray(numbers);
console.log(numbers);  // [1, 2, 3, 4] (تغير!)

تمارين عملية

تمرين 1: دالة الترحيب

اكتب دالة تأخذ اسماً وترجع "مرحباً [الاسم]".

الحل:

function greet(name) {
  return "مرحباً " + name;
}

console.log(greet("أحمد"));  // مرحباً أحمد

تمرين 2: دالة المجموع

اكتب دالة تأخذ رقمين وترجع مجموعهما.

الحل:

const add = (a, b) => a + b;

console.log(add(5, 3));   // 8
console.log(add(10, 20)); // 30

تمرين 3: دالة الأكبر

اكتب دالة تأخذ رقمين وترجع الأكبر.

الحل:

function max(a, b) {
  return a > b ? a : b;
}

console.log(max(5, 10));  // 10
console.log(max(20, 8));  // 20

تمرين 4: دالة الزوجي

اكتب دالة تتحقق إذا كان الرقم زوجياً.

الحل:

const isEven = (num) => num % 2 === 0;

console.log(isEven(4));  // true
console.log(isEven(7));  // false

تمرين 5: دالة المساحة

اكتب دالة تحسب مساحة مستطيل.

الحل:

function area(width, height) {
  return width * height;
}

console.log(area(5, 10));  // 50

تمرين 6: دالة المتوسط

اكتب دالة تأخذ مصفوفة أرقام وترجع متوسطها.

الحل:

function average(numbers) {
  let sum = 0;
  for (const num of numbers) {
    sum += num;
  }
  return sum / numbers.length;
}

console.log(average([10, 20, 30, 40]));  // 25

تمرين 7: دالة العكس

اكتب دالة تعكس نصاً.

الحل:

function reverseString(str) {
  return str.split("").reverse().join("");
}

console.log(reverseString("أحمد"));  // دمحأ

تمرين 8: دالة Factorial

اكتب دالة تحسب مضروب رقم (بشكل عودي).

الحل:

function factorial(n) {
  if (n <= 1) return 1;
  return n * factorial(n - 1);
}

console.log(factorial(5));  // 120

حل المشاكل الشائعة

🔴 المشكلة 1: undefined كنتيجة

السبب: نسيت return.

// خطأ:
function add(a, b) {
  a + b;  // لا return
}
console.log(add(5, 3));  // undefined

// صحيح:
function add(a, b) {
  return a + b;
}
console.log(add(5, 3));  // 8

🔴 المشكلة 2: is not a function

السبب: استدعاء متغير كدالة، لكنه ليس دالة.

const x = 5;
x();  // ❌ x is not a function

🔴 المشكلة 3: this في Arrow Functions

السبب: Arrow Functions لا تملك this خاصاً بها.

// خطأ:
const obj = {
  name: "أحمد",
  greet: () => {
    console.log(this.name);  // undefined
  }
};

// صحيح:
const obj = {
  name: "أحمد",
  greet: function() {
    console.log(this.name);  // أحمد
  }
};

🔴 المشكلة 4: نسيان استدعاء الدالة

السبب: كتابة اسم الدالة بدون ().

function greet() {
  console.log("مرحباً");
}

greet;    // ❌ لا ينفذ
greet();  // ✅ ينفذ

جدول الأوامر الأساسية

الأمر	الوظيفة
function name() {}	تعريف دالة
const name = () => {}	دالة سهمية
return value;	إرجاع قيمة
name(args);	استدعاء دالة
function(a, b = 5) {}	قيمة افتراضية

قائمة تحقق نهائية

المهمة	الحالة
فهم تعريف الدوال واستدعاؤها	⬜
استخدام المعاملات والقيم المرجعة	⬜
الفرق بين Function Declaration و Expression	⬜
استخدام Arrow Functions	⬜
فهم النطاق (Scope)	⬜
استخدام Callbacks	⬜
حل التمارين الثمانية	⬜

ماذا بعد هذا المقال؟

الآن بعد أن أتقنت الدوال، أنت جاهز للمقال التالي:

1. المصفوفات والكائنات — هياكل البيانات.
2. DOM — التفاعل مع صفحات الويب.
3. المشاريع العملية — بناء تطبيقات حقيقية.

الخلاصة

في هذا المقال، تعلمت:

• ✅ ما هي الدوال ولماذا نحتاجها.
• ✅ المعاملات (Parameters) والقيم المرجعة (Return).
• ✅ أنواع الدوال: Declaration, Expression, Arrow.
• ✅ النطاق (Scope) — محلي وعام.
• ✅ الدوال المُرجَعة (Callbacks).
• ✅ الدوال المجهولة والعودية.
• ✅ تمرير المعاملات: by Value vs by Reference.

تذكر: الدوال هي أدواتك الأساسية لتنظيم الكود. كلما أتقنتها، كلما أصبح كودك أنظف وأسهل صيانة.

هل أتقنت الدوال؟ شاركنا في التعليقات!