المتغيرات في JavaScript للمبتدئين: كيف تخزن القيم وتختار بين let و const و var؟

تخيّل أنك تريد حفظ اسم المستخدم بعد تسجيل الدخول، أو جمع سعر منتجين، أو تغيير حالة زر من "إرسال" إلى "تم". كل هذا يبدأ من شيء واحد: Variables في JavaScript.

إذا كنت تبحث عن شرح المتغيرات في JavaScript للمبتدئين أو الفرق بين let وconst وvar أو كيف أسمّي المتغيرات بشكل صحيح، فهذا الدرس هو نقطة البداية الصحيحة.

ما هي Variables في JavaScript؟

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

التعريف البسيط: المتغير مثل صندوق عليه اسم. تضع داخله قيمة، ثم تستخدم هذا الاسم بدل تكرار القيمة كل مرة.

كيف نعرّف المتغيرات في JavaScript؟

في JavaScript الحديثة، نستخدم غالباً let وconst. أما var فهو أسلوب أقدم ويستخدم بحذر.

1) مثال سريع: إنشاء متغير واستخدامه

let userName = 'Sara';
console.log('Hello', userName);

ماذا يفعل هذا الكود؟ ينشئ متغيراً باسم userName ثم يطبع قيمته.

النتيجة المتوقعة: ستظهر رسالة مثل Hello Sara في Console.

خطأ شائع: استخدام اسم متغير مختلف عند الطباعة (مثل username بدل userName).

الفرق بين let و const في JavaScript

let city = 'Rabat';
city = 'Casablanca'; // مسموح

const country = 'Morocco';
// country = 'France'; // Error

ماذا يفعل هذا الكود؟ يوضح أن let يسمح بإعادة التعيين، بينما const لا يسمح بذلك.

النتيجة المتوقعة: تغيير city ينجح، ومحاولة تغيير country تعطي خطأ.

خطأ شائع: تعريف قيمة تحتاج تغييراً لاحقاً باستخدام const.

لماذا يفضل تجنب var في JavaScript الحديث؟

لأن var قد يسبب سلوكاً مربكاً في بعض الحالات مثل النطاق (Scope) والـ Hoisting. لهذا تعتمد أغلب المشاريع الحديثة على let وconst لوضوح أكبر.

2) مثال يوضح مشكلة var باختصار

if (true) {
  var oldWay = 'I am var';
  let newWay = 'I am let';
}

console.log(oldWay); // works
// console.log(newWay); // Error

ماذا يفعل هذا الكود؟ يبيّن الفرق في النطاق بين var وlet داخل الكتل.

النتيجة المتوقعة: oldWay تبقى متاحة خارج if بينما newWay لا.

خطأ شائع: توقع أن var تتصرف مثل let داخل الكتل.

قواعد تسمية المتغيرات في JavaScript

• يبدأ الاسم بحرف أو _ أو $.
• لا يبدأ برقم.
• لا تستخدم الكلمات المحجوزة مثل if أو let.
• استخدم أسلوب camelCase مثل totalPrice وuserName.

Story قصيرة: خطأ تسمية يضيع وقتك

مبتدئ كتب المتغير باسم totalprice ثم استخدمه لاحقاً كـ totalPrice. ظل يبحث عن الخطأ في الحساب بينما المشكلة كانت في حرف كبير واحد. لذلك الالتزام بـ camelCase ليس شكلاً، بل يوفر وقتاً حقيقياً.

let userName = 'Sara';
const age = 22;
console.log(userName, age);

Checklist سريعة قبل تشغيل الكود

• هل اخترت const كخيار افتراضي عندما لا تحتاج تغيير القيمة؟
• إذا كانت القيمة ستتغير، هل استخدمت let؟
• هل اسم المتغير واضح ويستخدم camelCase؟
• هل تجنبت var إلا إذا كان لديك سبب واضح؟

روابط المتابعة بعد هذا الدرس

الخطوة التالية مباشرة: أنواع البيانات في JavaScript ثم الفرق التفصيلي بين var و let و const.

الأسئلة الشائعة — FAQ (أسئلة بحثية شائعة)

ما هي Variables في JavaScript؟

هي أسماء تُستخدم لتخزين القيم داخل البرنامج مثل النصوص والأرقام والقيم المنطقية.

ما الفرق بين let و const في JavaScript؟

let للمتغير القابل للتغيير، وconst للقيمة التي لا يجب إعادة تعيينها.

هل ما زال var مستخدم في JavaScript؟

موجود تاريخياً، لكنه أقل تفضيلاً في JavaScript الحديث مقارنة بـ let وconst بسبب مشاكل الوضوح والصيانة.

هل const تعني أن القيمة لا تتغير نهائياً؟

تعني أنك لا تعيد تعيين المتغير نفسه. في الكائنات والمصفوفات قد تتغير المحتويات، لكن مرجع المتغير يبقى ثابتاً.

ما أول خطوة بعد فهم variables؟

انتقل إلى أنواع البيانات لتفهم ما الذي يمكن تخزينه داخل المتغير وكيف تتعامل معه.

للمتابعة مباشرة: ابدأ بدرس أنواع البيانات في JavaScript ثم انتقل إلى الفرق التفصيلي بين var و let و const.