Introduction to Data and Variables

أي برنامج في الدنيا، مهما كان بسيط أو معقد، هدفه الأساسي هو التعامل مع الـ Data (البيانات). إنت بتدخل بيانات للبرنامج، هو بيعمل عليها شوية عمليات (Processing)، وفي الآخر بيطلع لك الـ Output اللي إنت محتاجه.

أمثلة:

  • برامج الحسابات: بتدخل سعر المنتج، والعدد، والخصم، والبرنامج يحسب ويطلع لك الإجمالي.
  • الـ Facebook: الـ Data هنا هي الـ Comments، الـ Posts، الـ Videos، والـ Photos. كل ده بيحصله معالجة وتصميم عشان يظهر لك بالشكل اللي بتشوفه.

وعشان نقدر نشيل الـ Data دي جوه الكود بتاعنا، بنحتاج “حاوية” أو “حافظة” (Container) تشيل القيمة دي ونقدر نستخدمها في أي مكان، وهنا بييجي دور الـ Variables.


Understanding Variables in JavaScript

الـ Variable هو مكان في الذاكرة بنحجز له اسم وبنخزن فيه قيمة. عشان تعمل الـ Variable في الـ JavaScript، بنستخدم الكلمة المحجوزة var وبعدها بنكتب الاسم اللي إحنا عايزينه.

مثال:

// Declare a variable and assign a value
var username = "Mahmoud CornPop"; 

ملاحظات سريعة:

  • الـ JavaScript مش بتفرق بين الـ Single quotes '' والـ Double quotes "". الاتنين شغالين معاك زي الفل.
  • إحنا ليه بنسميه الـ Variable؟ عشان قيمته متغيرة. النهاردة الـ username ممكن يكون “أحمد”، وبكرة يكون “محمد” أو “سيد” على حسب الداتا اللي جاية من الـ Database.

Processing Flow in Software

الرسم ده بيوضح إزاي الـ Data بتتحرك جوه أي سوفت وير:

graph LR
    A[Input Data] --> B[Variables & Containers]
    B --> C[Processing & Operations]
    C --> D[Output to User]

Declaration vs. Assignment

السطر اللي بنكتبه ده في الحقيقة بيعمل حاجتين مع بعض، وممكن نفكهم لسطرين منفصلين:

  1. الـ Declaration (التعريف): إنك بتقول للغة إن فيه “حافظة” جديدة اسمها كذا.
  2. الـ Assignment (التخصيص): إنك بتحط قيمة جوه الحافظة دي.

مثال للتوضيح:

// Declaration only
var username; 
 
// Assignment only
username = "Mahmoud CornPop"; 
 
// Both in one line
var userAge = 28;

Naming Rules for Variables

لما تيجي تسمي الـ Variable بتاعك، فيه 3 شروط أساسية لو خالفتهم الـ JavaScript هتطلع لك “Error”:

  1. ممنوع يبدأ برقم: مينفعش تسمي الـ Variable بتاعك 7up مثلاً. لكن ممكن الرقم يكون في النص أو في الآخر.
  2. ممنوع الكلمات المحجوزة (Reserved Words): اللغة ليها كلمات خاصة بيها زي var أو if أو function. مينفعش تستخدم الكلمات دي كأرقام.
  3. ممنوع المسافات: الـ Variable لازم يكون كلمة واحدة متصلة. مينفعش تسميه user name.

إضافة مهمة:

الـ Variable ممنوع يبدأ بأي “Special Character” (رموز خاصة) ماعدا رمزين بس مسموح بيهم في البداية وهما:

  • الـ Under Score _ (مثال: _user).
  • الـ Dollar Sign $ (مثال: $price).

The Camel Case Convention

لو عندك الـ Variable اسمه طويل ومكون من أكتر من كلمة، زي مثلاً “سعر المنتج بعد الخصم”، لو كتبتها كده productpriceaftersale هتبقى صعبة جداً في القراءة.

الحل هو الـ Camel Case. القاعدة بتقول: “كل الكلمات تبدأ بحرف Capital ما عدا أول كلمة تبدأ بحرف Small”.

مثال:

// Correct Camel Case naming
var productPriceAfterSale = 500;

الـ JavaScript نفسها بتتبع الطريقة دي في الـ Built-in functions بتاعتها، زي الـ getElementById.


Summary

  1. الـ Variables هي “حاويات” بنحفظ فيها الـ Data المتغيرة.
  2. بنستخدم الكلمة المحجوزة var لتعريف الـ Variable.
  3. العملية بتنقسم لـ Declaration (تعريف) و Assignment (إعطاء قيمة).
  4. لازم تلتزم بشروط التسمية (مفيش أرقام في الأول، مفيش كلمات محجوزة، مفيش مسافات).
  5. الأفضل تستخدم طريقة الـ Camel Case لو الاسم طويل.

Notes

  • الـ Correction: في الـ JavaScript الحديثة (ES6+)، بنفضل نستخدم let و const بدل var لأنهم بيحلوا مشاكل تقنية متعلقة بالـ “Scope” والـ “Hoisting”. الـ const بنستخدمها لو القيمة مش هتتغير، والـ let لو القيمة هتتغير.
  • الـ Clarification: بخصوص الـ Special Characters، برغم إن الـ _ والـ $ مسموح بيهم، إلا إنه مش من المفضل استخدامهم في البداية إلا في حالات برمجية معينة (زي الـ Private variables أو الـ Library objects).
  • الـ Advanced Topics: فيه مفهوم اسمه الـ “Strict Mode” في الـ JavaScript. لو فعلته، هيمنعك إنك تستخدم الـ Variable قبل ما تعمل له Declaration، وده بيخلي الكود “Clean” أكتر.
  • الـ Relation to .NET: في الـ .NET، التسمية بتختلف شوية. إحنا في الـ C# بنستخدم الـ Pascal case (كل الكلمات أول حرف فيها Capital بما فيهم أول كلمة) لتسمية الـ “Classes” والـ “Methods”، وبنستخدم الـ camelCase للـ “Local Variables”.