JavaScript Variables and Data Types

تعلم أساسيات لغة البرمجة جافا سكريبت - JavaScript - باللغة العربية، كيفية إنشاء المتغير (Variable)، ما هي أنواع البيانات في لغة الجافا سكريبت JavaScript؟ البيانات المنطقية، الرقمية، النصية، نوع البيانات Null، ونوع البيانات undefined، مقدمة لإنشاء المصفوفات Arrays في لغة البرمجة جافا سكريبت JavaScript، ومقدمة للبيانات الكائنية (الشيئية) Object في لغة الجافا سكريبت

محتويات سلسلة المقالات

المتغيرات (Variables) في لغة البرمجة JavaScript

المتغير أو الـ variable هو عبارة عن مساحة محددة أو مكان مخصص يتم حجزه في الذاكرة العشوائية RAM، ويتم تخزين بعض البيانات في هذه المساحة بغرض إجراء بعض العمليات عليها، أو بطريقة مبسطة يمكنك أن تعتبر المتغير هو عبارة عن صندوق تستطيع أن تضع بداخله أي نوع من البيانات ويتم تحديد إسم للصندوق، وفي أي وقت تحتاج أن تستخدم البيانات التي قمت بحفظها تستطيع إستخدامها من خلال الإسم الذي قمت بتحديده. يوجد بعض القواعد التي يجب إتباعها لإنشاء المتغيرات في لغة البرمجة جافا سكريبت، وهي كالتالي

  • لإنشاء المتغير يجب أن تستخدم الأمر var وهو عبارة عن أمر يسبق إسم المتغير ويفصله عن المتغير مسافة أو أكثر، ويمكن أن يستخدم لإنشاء متغير واحد أو أكثر من متغير في نفس الأمر
  • يجب أن يبدأ إسم المتغير بحرف (صغير أو كبير) أو شرطة تحتية Underscore _ أو علامة الدولار $
  • يمكن أن يحتوي إسم المتغير على أرقام ولكن لايمكن أن يبدأ برقم
  • لايمكن أن يتم إستخدام الكلمات المحجوزة للغة الجافا سكريبت كإسم للمتغير، ومن أمثلتها (var, if, else, function, typeof, true, false ...)
  • لغة الجافا سكريبت حساسة لحالة الأحرف (Case Sensitive)، أي أن الحرف A يختلف عن الحرف a
  • يمكن تحديد قيمة للمتغير أثناء إنشاؤه أو يمكن تحديد القيمة بعد إنشاء المتغير
var <variable name> = [value] [, <variable name> = [value]];

وسوف نبدأ تطبيق القواعد بإنشاء متغير يدعى year وذلك من خلال الأمر التالي

JavaScript

var year;

لتنفيذ الأمر السابق، سوف يقوم مترجم لغة الجافا سكريبت (الموجود في المتصفح) بحجز مساحة في الذاكرة العشوائية RAM وسوف يرمز لها بالإسم year وفي هذه الحالة سوف تكون قيمة هذا المتغير (المساحة المحجوزة في الـ RAM) هي undefined وهذه الكلمة تعني غير معرف وهو نوع من البيانات الخاصة بلغة الجافا سكريبت، وتستخدم مع المتغيرات في حالة عدم تسجيل قيمة للمتغير، ولإعطاء قيمة للمتغير يمكنك ذلك من خلال إضافة الأمر التالي year = 2018; وبذلك يتم حفظ القيمة 2018 في المكان المحجوز في الذاكرة العشوائية والمسمى بـ year. أو يمكنك إنشاء المتغير وإعطاؤه القيمة في جملة واحدة والشكل التالي يوضح كيفية إنشاء المتغير، وماذا يحدث في الذاكرة وقت إنشاء المتغير

Create new Variable in JavaScript

ولكي تتمكن من فهم القواعد بشكل جيد يمكنك تطبيق الأمثلة التالية بإستخدام الـ Console كما شرحنا طريقة إستخدامه في المقالة مقدمة للبرمجة بلغة جافا سكريبت أو بإستخدام أي من الطرق الموجودة في مقالة كيفية إضافة أكواد جافا سكريبت إلى صفحة الـ HTML

JavaScript

var year = 2018;
var month = "April";
var day;
day = 22;
// الدالة المستخدمة لعرض قيمة المتغيرات من خلال المتصفح
alert(day + "/" + month + "/" + year);

من الأمثلة السابقة سوف تلاحظ أننا قمنا بإنشاء ثلاثة متغيرات، وفي كل مرة نقوم بإنشاء متغير فإننا نستخدم الأمر var متبوع بإسم المتغير ثم قيمة المتغير إن وجدت، ويمكننا أيضا تحديد قيمة المتغير بعد إنشاؤه كما في المتغير day حيث قمنا بتحديد قيمته بعد أن قمنا بإنشاء المتغير، وسوف تلاحظ أيضا أننا إستخدمنا علامة الفاصلة المنقوطة (Semicolon) ; في نهاية كل سطر، حيث تحدد هذه العلامة نهاية الأمر في لغة الجافا سكريبت، وسوف تلاحظ أيضا أننا إستخدمنا علامتين // وتستخدم هذه العلامات لكتابة تعليق بداخل الكود، حيث يمكنك أن تكتب شرح للكود من خلال كتابة التعليق، حيث يتم تجاهل كل ما هو مكتوب في السطر الذي يلي العلامتين //، وسوف تلاحظ أيضا أننا إستخدمنا الدالة alert وهي دالة موجودة في لغة الجافا سكريبت وتقوم بعرض الموجود بداخل الأقواس من خلال نافذة تظهر في المتصفح، وسوف نتناول الدوال بالتفصيل لاحقا،ويمكننا إنشاء المتغيرات الثلاث بإستخدام أمر واحد، وذلك بكتابة الأمر var متبوعا بالمتغيرات ويفصل بينهم علامة الفاصلة كما يلي

JavaScript

var year = 2018, month = "April", day;
day = 22;
alert(day + "/" + month + "/" + year);


أنواع البيانات في لغة البرمجة جافا سكريبت JavaScript Data Types

في معظم لغات البرمجة يتم تحديد نوع البيانات التي سوف يتم حفظها في المتغير أثناء إنشاء المتغير، ولا يمكن تغيير نوع بيانات المتغير بعد ذلك، فعند إنشاء متغير لحفظ أرقام لا يمكن تسجيل بيانات نصية في هذا المتغير بعد ذلك، ولكن في لغة البرمجة جافا سكريبت يختلف الأمر كثيرا، فكما تعلمنا أن إنشاء المتغير يتم بإستخدام الأمر var وهذا الأمر يقوم بإنشاء متغير عام أو شامل ويسمى Generic Variable أي أنه لا يتم تحديد نوع للبيانات التي يتم تخزينها في المتغير، فيمكنك على سبيل المثال أن تنشئ متغير لتسجيل الشهر، ويمكنك تسجيل الشهر بصيغة رقمية وفي أي وقت يمكنك تغيير الصيغة لتصبح نصية، ولا يعني ذلك أن لغة البرمجة جافا سكريبت لا تهتم بأنواع المتغيرات، ولكن تستخدم أنواع البيانات لأن كل نوع من البيانات تقوم بإجراء عمليات مختلفة عليه، فمثلا عملية الجمع بين البيانات الرقمية تختلف عن عملية الجمع في البيانات النصية، ويوجد العديد من أنواع البيانات المستخدمة في لغة البرمجة جافا سكريبت، وهي كالتالي

Boolean - البيانات المنطقية وهي نوع من البيانات التي يمكن أن تحتوي على قيمتين فقط، إما صح (true) أو خطأ (false) وتستخدم في الجمل الشرطية (if ... else)، والحلقات أو التكرار (Loops)، وفي العديد من الأوامر البرمجية، وتعتبر من أهم أنواع البيانات التي تعتمد عليها كل لغات البرمجة.

Number - البيانات الرقمية وهي نوع البيانات الذي يمثل الأرقام (الأعداد) سواء كانت أعداد صحيحة أو عشرية (تحتوي على كسور) حيث أن هناك لغات برمجة مثل (java, C, VB) تميز بين الأعداد حيث يوجد نوع بيانات للأعداد الصحيحة ونوع آخر للأعداد العشرية أما لغة الجافا سكريبت تستخدم نوع بيانات واحد لكل الأعداد الصحيحة والعشرية. وتستخدم البيانات الرقمية لإجراء العمليات الحسابية من جمع وطرح وضرب وقسمة وباقي القسمة.

String - البيانات النصية وهي البيانات التي تحتوي على حرف أو أكثر ويمكن أن يتم إستخدام الأرقام من خلال تمثيلها كبيانات نصية، ولكي يتم إنشاء بيانات نصية يتم كتابة النص بين علامتي التنصيص سواء كانت علامات مفردة Single Quote (' ') أو علامات مزدوجة Double Quote (" ") بشرط إذا بدأت الجملة (النص) بعلامة تنصيص مفردة يجب أن ينتهي النص بعلامة تنصيص مفردة وأن لا يحتوي النص أو الجملة على أي علامة تنصيص مفردة، وكذلك الحال بالنسبة لعلامة التنصيص المزدوجة تبدأ الجملة بعلامة مزدوجة و تنتهي بعلامة تنصيص مزدوجة ولا يحتوي النص على أي علامة تنصيص مزدوجة، كما في الأمثلة التالية

JavaScript

var str1 = "text in double quote";
var str2 = 'text in single quote';
var str3 = "I'm Ahmed";
var str4 = 'This is a "string" in single quote';

var str5 = 'I\'m Ahmed';
var str6 = "This is how to \"escape\" quotes";

في الأمثلة السابقة طريقة إنشاء متغير في لغة الجافا سكريبت يحتوي على بيانات نصية بأكثر من طريقة، حيث في المتغيرات str1 و str2 بيانات نصية مرة بعلامة تنصيص مفردة ومرة بعلامة تنصيص مزدوجة، أما المتغيرات str3 و str4 فهي متغيرات نصية تحتوي الجملة المستخدمة على على علامة تنصيص إما مفردة أو مزدوجة وكيفية إنشاء المتغير بهذه الجمل، أما في المثال str5 فقد أنشأنا المتغير النصي بإستخدام علامة التنصيص المفردة والجملة تحتوي على نفس العلامة وبالتالي قمنا بإستخدام العلامة \ والتي تسمى Backslash قبل علامة التنصيص بداخل الجملة وذلك لكي نعلم مترجم لغة الجافا سكريبت بأن علامة التنصيص هذه هي من مكونات الجملة وبالتالي يكمل باقي الجملة ولا يتوقف عند هذه العلامة وتسمى هذه العملية escape أو تخطي علامة التنصيص ونفس الطريقة تم إستخدامها في مثال المتغير str6 حيث قمنا بتخطي كل علامات التنصيص التي توجد بداخل النص.

Undefined - نوع بيانات غير معرف وغالبا ما يتم التعامل مع هذا النوع في حالة كتابة إسم المتغير بطريقة غير صحيحة، أو إستخدام متغير لم يتم تحديد قيمته بعد.

Null - نوع بيانات فارغ وهو نوع البيانات الذي يستخدم لمسح البيانات من المتغير، أو بمعنى أبسط غالبا ما يستخدم لإزالة البيانات من الذاكرة RAM.

Object - البيانات الكائنية وهو نوع البيانات الذي يستخدم لوصف الكائن (الشيء) في لغات البرمجة الكائنية أو التي تدعم هذا النوع من البيانات، أو بمعنى أبسط إذا إعتبرت السيارة كائن أو شيء فكيف تستطيع تمثيل السيارة من خلال برنامجك، حيث لا يمكن أن تمثل السيارة بنوع البيانات الرقمية فقط ولا النصية فقط وبالتالي يمكن أن تعرف المتغير الخاص بوصف السيارة من نوع البيانات الكائنية حيث من خلالة تستطيع تحديد نوع السيارة وسنة الصنع ولون السيارة وعزم السيارة وأبعادها وأي شيء يمكن أن يستخدم لوصف السيارة، ولإنشاء كائن في لغة البرمجة جافا سكريبت نستخدم الأقواس المعقوفة أو المتعرجة والمسماة بـ Curly Braces { } والمثال التالي سوف يوضح أساسيات إنشاء كائن في لغة البرمجة جافا سكريبت

JavaScript

var car = {};
car.weight = 1300;
car.color = 'black';
car.speed = 220;
car.year = 2010;

var car2 = {
  weight: 1100,
  color: 'red',
  speed: 200,
  year: 2005
};

في المثال السابق قمنا بإنشاء متغير car من نوع البيانات الكائنية وقمنا بإضافة خصائص للكائن حيث يتم إستخدام علامة النقطة بعد إسم الكائن متبوعة بإسم الخاصية لتحديد قيمة الخاصية أو قراءتها، وسوف تلاحظ أن كل خاصية من خصائص الكائن ما هي إلا متغير من نوع البيانات الرقمية أو النصية ويمكن أن تكون أيضا الخاصية تمثل كائن آخر ولكن لتبسيط الأمر في بداية التعلم يكفي أن تعرف أن الكائن في لغة البرمجة جافا سكريبت هو عبارة عن مجموعة من المتغيرات التي تربطها علاقة ببعضها البعض ففي المثال سوف تجد المتغير weight و color و speed و year هي عبارة عن متغيرات من النوع الرقمي أو النصي ولكن كل هذه المتغيرات هي عبارة عن وصف لخصائص السيارة وبالتالي تم جمعهم سويا في متغير واحد وهو المتغير car من نوع البيانات الكائنية، والمثال الذي يليه هو طريقة أخرى لأنشاء الكائن في لغة البرمجة جافا سكريبت.

Array - المصفوفات وهي عبارة عن نوع من البيانات يمكنك من تخزين أكثر من قيمة في متغير واحد، ويمكن أن يحتوي على قيم من أكثر من نوع من البيانات، حيث يمكن أن يحتوي على بيانات رقمية ونصية ومن النوع null، وتعتبر المصفوفات من البيانات المهمة في لغات البرمجة، ولإنشاء مصفوفة في لغة البرمجة جافا سكريبت نستخدم الأقواس المربعة والمسماه بـ Square Brackets [] ويمكنك التعرف أكثر على المصفوفات من خلال الأمثلة التالية

JavaScript

var mix = [100, null, true, "Text"];
mix[0];      // 100
mix[1];      // null
mix[2];      // true
mix[3];      // "Text"

سوف تلاحظ في المثال السابق أننا أنشأنا متغير يسمى mix وهو من نوع المصفوفات، وتحتوي المصفوفة على أربع بيانات (قيم) من أنواع مختلفة، ولكي يتم إستخدام البيانات المخزنة بداخل المصفوفة يتم كتابة إسم المصفوفة متبوعا بقوسين مربعين بداخلهما ترتيب البيانات في المصفوفة، ويسمى هذا الترتيب بـ index حيث يتم ترتيب البيانات في المصفوفة بداية من الرقم 0، ويمكنك إعتبار هذا الترتيب مثل الرقم المسلسل في أي كشف أو جدول، ويوجد عدة طرق لإنشاء المصفوفة ولكن تعتبر هذه الطريقة هي الأسهل لتبدأ بها، وسوف نتناول باقي الطرق بالتفصيل في مقالات أخرى.


ولكي تتعرف أكثر على أنواع البيانات يمكنك إستخدام الأمر typeof وهو أحد أوامر لغة البرمجة جافا سكريبت ويستخدم لتحديد أنواع البيانات فيمكنك من خلال الـ Console أن تكتب الأمر متبوعا بالمتغير أو القيمة وسوف تحصل على نوع البيانات المستخدم و الأمثلة التالية توضح ذلك

JavaScript

var a = 1.1;

typeof 44;      // number
typeof 'text';  // string
typeof "text";  // string
typeof {};      // object
typeof [];      // array
typeof null;    // null
typeof a;       // number
typeof A;       // undefined

التالي: أساسيات جافا سكريبت: الجملة الشرطية