7- المتغيرات في جافاسكربت (JavaScript Variables)

المتغيرات في جافاسكربت مثل صناديق صغيرة تستخدم لتخزين بيانات مختلفة. تشبه المتغيرات الملصقات التي تضعها على علب الهدايا، حيث يمنحك الملصق اسمًا للشيء المخزن بالداخل، والمتغير هو اسم للبيانات التي تحتفظ بها.

هناك أربع طرق رئيسية لإنشاء متغيرات في جافاسكربت:

1. التلقائي (غير موصى به): في حالة عدم تعريف المتغير بشكل صريح قبل استخدامه، يقوم جافاسكربت تلقائيًا بإنشاء المتغير عند الاستخدام الأول. من الأفضل تجنب هذه الطريقة واعتماد تعريف المتغيرات بشكل صريح.
2. باستخدام الكلمة المفتاحية var (قديمة): كانت var الكلمة المفتاحية الأساسية لإنشاء المتغيرات في جافاسكربت حتى عام 2015. لا يوصى باستخدام var في مشاريع جديدة، واستخدم let أو const بدلاً منها.
3. باستخدام الكلمة المفتاحية let: تم تقديم let في عام 2015، وهي الطريقة المفضلة الآن لإنشاء متغيرات. يُستخدم let لإنشاء متغيرات يمكن تغيير قيمتها لاحقًا في البرنامج.
4. باستخدام الكلمة المفتاحية const: تم تقديم const أيضًا في عام 2015، وهي تُستخدم لإنشاء قيم ثابتة لا يمكن تغييرها لاحقًا في البرنامج.

الأمثلة:

1. التلقائي (غير موصى به):

x = 5;
y = 6;
z = x + y;

2. باستخدام var (قديمة):

var x = 5;
var y = 6;
var z = x + y;

3. باستخدام let:

let x = 5;
let y = 6;
let z = x + y;

4. باستخدام const:

const price1 = 5;
const price2 = 6;
const total = price1 + price2;

في هذا المثال الأخير:

• تم تعريف المتغيرين price1 و price2 باستخدام const لأن قيمتهما ثابتة ولا تتغير.
• تم تعريف المتغير total باستخدام let لأنه سيتم حساب قيمته لاحقًا.

ملخص:

• قم دائمًا بتعريف المتغيرات قبل استخدامها.
• استخدم const للمتغيرات التي لن تتغير قيمتها.
• استخدم let للمتغيرات التي يمكن تغيير قيمتها لاحقًا.
• تجنب استخدام var إلا في حالات الضرورة القصوى مع المتصفحات القديمة.

المتغيرات في جافاسكربت مثل المتغيرات في الجبر (Just Like Algebra)

تشبه المتغيرات في جافاسكربت المتغيرات المستخدمة في الجبر. حيث يتم استخدامها لتخزين قيم معينة.

على سبيل المثال:

let x = 5;
let y = 6;

في هذا المثال، قمنا بتعريف متغيرين x و y وأعطيناهما قيمتين (5 و 6) على التوالي.

بالمثل، تُستخدم المتغيرات في جافاسكربت في التعبيرات (Expressions) لحساب قيم جديدة.

على سبيل المثال:

let z = x + y;

في هذا المثال، قمنا بحساب مجموع x و y وأعطينا النتيجة للمتغير z. بناءً على الأمثلة السابقة، يمكن استنتاج أن قيمة z تساوي 11 (5 + 6).

ملخص:

• المتغيرات في جافاسكربت مثل المتغيرات في الجبر، حيث تخزن قيمًا معينة.
• يتم استخدام المتغيرات في التعبيرات لإجراء عمليات حسابية أو تجميع قيم.

معرفات جافاسكربت (JavaScript Identifiers)

يجب أن يكون لكل متغير في جافاسكربت اسم فريد خاص به. يطلق على هذه الأسماء الفريدة المُعرّفات (Identifiers).

يمكن أن تكون المعرفات أسماء قصيرة (مثل x و y) أو أسماء وصفية أكثر (مثل age، sum، totalVolume).

قواعد عامة لإنشاء أسماء للمتغيرات (معرفات فريدة):

• يمكن أن تتضمن الأسماء حروفًا وأرقامًا وشرطات سفلية وعلامات دولار ($).
• يجب أن يبدأ الاسم بحرف.
• يمكن أن تبدأ الأسماء أيضًا بـ $ و _ (ولكن لن نستخدمها في هذا الدليل).
• الأسماء حساسة لحالة الأحرف (y و Y يعتبران متغيرين مختلفين).
• لا يمكن استخدام الكلمات المخصصة (مثل كلمات جافاسكربت المفتاحية) كأسماء.

ملخص:

• يجب أن تكون أسماء المتغيرات (المعرّفات) فريدة.
• أسماء المتغيرات حساسة لحالة الأحرف.

عامل التعيين في جافاسكربت (The Assignment Operator)

في جافاسكربت، يُعد علامة التساوي (=) عامل “تعيين”، وليس عامل “يساوي”. يختلف هذا عن مفهوم التساوي في الجبر.

على سبيل المثال، لا معنى للتعبير التالي في الجبر:

x = x + 5

لكن في جافاسكربت، يكون لهذا المعنى تمامًا: فهو يعين قيمة x + 5 إلى المتغير x. (بمعنى آخر، يقوم بحساب قيمة x + 5 ويضع النتيجة في x. وبالتالي يتم زيادة قيمة x بمقدار 5).

ملخص:

• يُستخدم عامل التعيين (=) لتعيين قيمة لمُتغير ما.
• يختلف عامل التعيين في جافاسكربت عن مفهوم التساوي في الجبر.

أنواع البيانات في جافاسكربت (JavaScript Data Types)

يمكن للمتغيرات في جافاسكربت تخزين أرقامًا مثل 100 وقيم نصية مثل “John Doe”. تسمى قيم النصوص في البرمجة سلاسل نصية (text strings).

يمكن لجافاسكربت التعامل مع أنواع عديدة من البيانات، ولكن في الوقت الحالي، يكفي التفكير في الأرقام والسلاسل النصية.

• تُكتب السلاسل النصية بين علامتين (مزدوجتين أو مفردتين).
• تُكتب الأرقام بدون علامات اقتباس.
• إذا وضعت رقمًا بين علامتي اقتباس، فسيتم التعامل معه على أنه سلسلة نصية.

على سبيل المثال:

const pi = 3.14;
let person = "John Doe";
let answer = 'Yes I am!';

ملخص:

• يمكن للمتغيرات في جافاسكربت تخزين نوعين رئيسيين من البيانات: الأرقام والسلاسل النصية.
• يتم كتابة السلاسل النصية بين علامتي اقتباس (مزدوجتين أو مفردتين)

تعريف متغير في جافاسكربت (Declaring a JavaScript Variable)

تعريف متغير في جافاسكربت هو إنشاء متغير جديد. يتم تعريف متغير جافاسكربت باستخدام الكلمة المفتاحية var أو let.

على سبيل المثال:

var carName;

أو

let carName;

بعد التعريف، لا يملك المتغير أي قيمة (قيمته الفنية هي undefined).

لتعيين قيمة للمتغير، نستخدم علامة التساوي (=):

carName = "Volvo";

يمكنك أيضًا تعيين قيمة للمتغير عند تعريفه:

let carName = "Volvo";

في المثال التالي، نقوم بإنشاء متغير يسمى carName ونعطي قيمة “Volvo” له. بعد ذلك، نقوم “بإظهار” القيمة داخل فقرة HTML مع معرف “demo”:

<p id="demo"></p>

<script>
let carName = "Volvo";
document.getElementById("demo").innerHTML = carName;
</script>

ملاحظة: من الممارسات الجيدة في البرمجة تعريف جميع المتغيرات في بداية النص البرمجي.

بيان واحد، العديد من المتغيرات (One Statement, Many Variables)

يمكنك تعريف العديد من المتغيرات في بيان واحد. ابدأ البيان باستخدام let وافصل المتغيرات باستخدام الفاصلة (،):

على سبيل المثال:

let person = "John Doe", carName = "Volvo", price = 200;

يمكن أن يمتد التعريف على أسطر متعددة:

let person = "John Doe",
carName = "Volvo",
price = 200;

القيمة = غير معرّفة (Value = undefined)

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

المتغير الذي يتم تعريفه بدون قيمة سيكون له قيمة undefined.

سيصبح للمتغير carName القيمة undefined بعد تنفيذ هذا البيان:

let carName;

إعادة تعريف المتغيرات في جافاسكربت (Re-Declaring JavaScript Variables)

إذا أعدت تعريف متغير جافاسكربت معلن باستخدام var، فلن يفقد قيمته.

على سبيل المثال:

var carName = "Volvo";
var carName;

سيظل للمتغير carName قيمة “Volvo” بعد تنفيذ هذه البيانات.

ملحوظة مهمة: لا يمكنك إعادة تعريف متغير معلن باستخدام let أو const.

على سبيل المثال، لن يعمل هذا الكود:

let carName = "Volvo";
let carName;

العمليات الحسابية في جافاسكربت (JavaScript Arithmetic)

مثل الجبر، يمكنك إجراء عمليات حسابية باستخدام المتغيرات في جافاسكربت، وذلك باستخدام معاملات مثل (=) و (+).

على سبيل المثال:

let x = 5 + 2 + 3;

يمكنك أيضًا إجراء عمليات جمع على السلاسل النصية، ولكن سيتم وصل السلاسل بدلاً من عملية الجمع الحسابية.

على سبيل المثال:

let x = "John" + " " + "Doe";

جرب أيضًا هذا المثال:

let x = "5" + 2 + 3;

ملاحظة: إذا وضعت رقمًا بين علامتي اقتباس، فسيتم التعامل مع باقي الأرقام على أنها سلاسل نصية، ويتم وصلها معًا.

let x = 2 + 3 + "5";

علامة الدولار ($) في جافاسكربت (JavaScript Dollar Sign $)

بما أن جافاسكربت تتعامل مع علامة الدولار كحرف، فإن المعرفات التي تحتوي على علامة الدولار تعتبر أسماء متغيرات صحيحة:

على سبيل المثال:

let $ = "Hello World";
let $$$ = 2;
let $myMoney = 5;

استخدام علامة الدولار ليس شائعًا جدًا في جافاسكربت، ولكن المطورين المحترفين يستخدمونها غالبًا كاختصار للوظيفة الرئيسية في مكتبة جافاسكربت.

على سبيل المثال، في مكتبة جافاسكربت jQuery، يتم استخدام الوظيفة الرئيسية $ لاختيار عناصر HTML. يعني $("p"); في jQuery “اختيار كل عناصر الفقرات (p)”.

شرطة (_) في جافاسكربت (JavaScript Underscore _)

بما أن جافاسكربت تتعامل مع شرطة (_) كحرف، فإن المعرفات التي تحتوي على الشرطه تعتبر أسماء متغيرات صحيحة:

على سبيل المثال:

let _lastName = "Johnson";
let _x = 2;
let _100 = 5;

استخدام شرطة (_) ليس شائعًا جدًا في جافاسكربت، ولكن من المتعارف عليه بين المطورين المحترفين استخدامها كاختصار للمتغيرات “الخاصة (المخفية)”.