JavaScript

JavaScript Constants
الثوابت في لغة جافا سكريبت

سنتعلم في هذا الدرس الثوابت في لغة جافا سكريبت JavaScript Constants وهي ان نحفظ قيم يمكن استرجاعها في اي وقت وهذه القيم متوافقة مع انواع البيانات في لغة جافا سكريبت,سنلقي نظره عامه عن الثوابت, ثم نتطرق الي طريقة كتابتها في لغة الجافا سكريبت Constant Syntax,ثم بدون المتغيرات ما الذي يحدث Without a Constant, ايضاً سنتحدث عن قواعد او شروط الاسماء في الثوابت Constant naming rule, ثم عملية التهئية في الثوابت Declaring Constants,ثم عملية Initialization, ثم العمليات الحسابية باستخدام الثوابت في لغة جافا سكريبت JavaScript Arithmetic.

التاريخ

02 نوفمبر 2021

الدروس

146

المستوى

العامة

اللغة

انجليزي

المشاهدات

2814

المواضيع

24
الشروحات chevron_left JavaScript Constants chevron_left JavaScript

JavaScript Constants
الثوابت في الجافا سكريبت

</> JavaScript Constants
الثوابت في الجافاسكريبت

الثابت Constant وهي عكس المتغيرات في لغة البرمجة حيث يمكننا اجراء تحديثات او اعادة تعيين القيم في المتغيرات ولكن في الثوابت لا يمكننا فعل ذلك لان لا تسمح لغة جافا سكريبت بذلك او لغات البرمجه بشكل عام.

تم انشاء ال Constant في الإصدار ES6 في عام 2015 ، والتي تستخدم لتعريف ثابت جديد في JavaScript, ,وهي محددة القيم لا يمكن تعديل هذة القيم مره اخره بعد الانشاء او عملية التهيئة.

الثوابت Constant هي عبارة عن حاوية container يتم  تخزين  بداخلها قيمة معينة Value عن طريق ال Names الأسماء الخاصة بها ونستطيع استرجاعها في اي وقت ولا يمكننا تغيير القيمة عن طريق لغة JavaScript اثناء التشغيل. 


متي نستخدم الثابت بدلاً من المتغيرات في لغة جافا سكريبت ؟

نستخدم الثوابت عندما نكون متأكدين ان القيمة لن تتغير ابداً لضمان التصريح بوضوح للجميع بأن هذه القيمة لن تتغير.

يعني ذلك استبدال كلمة var او let ب const keyword.

</> Constant syntax
تعريف او الاعلان علي متغير في لغة جافا سكريبت

تأتي الثوابت Constants علي هيئة:

  •  [ const ] Declare keyword وهو اعلان او اخبار المتصفحات بلغة جافا سكريبت اننا قمنا بانشاء ثابت جديد.
  • [ Name ] ينطبق علي الاسماء شروط وقواعد محددة سنتعرف عليها في هذا الدرس.
  • [ ] assign Operators  وهي علامات رياضية لتتم عملية التعيين اي نعلن ان الثابت يساوي قيمة معينة ولا نستطيع اعادة تعيينة بعكس المتغير.
  • [ Value ] وهي القيم التي تخزن داخل الثوابت يمكن تخزين اي قيمه من ال Data Types في لغة الجافا سكريبت وتكون نصوص او رموز او كلمات محجوزه او مصفوفات arrays او كائنات objects او تساوي ثابت اخر.

النص يتم حفظه في منطقة الذاكره مع اسم الثابت. نستطيع  الوصول الي القيمة التي بداخل الثابت عن طريق اسم الثابت constant name.

Constant Syntax

const USERNAME = "Ahmed";
document.write("<b>"+ USERNAME +"<b><br>");

الفرق بين الثوابت والمتغيرات

  • عند انشاء الثابت يجب ان يبدأ بكلمة const keyword بينما المتغير يبدأ بكلمة var keyword.
  • الثابت لا يمكن تعيين او تغيير القيمة بعد انشاؤه بينما المتغير يمكن ان تعيد تعيينه او تغيير قيمتة في اي وقت مرات عديدة.
  • كتابة الثوابت Constants بحروف كبيرة Capitalize حتي نفرق بينه وبين المتغيرات Variables وهذا الشئ يفضل وليس ضرورياً.

</> Constants naming rules
قواعد او شروط تسمية الثوابت

يمكنك تسمية الثابت في لغة Java Script إلى أي شيء تريده، ولكن هناك قيود او شروط علي الاسماء. بشكل عام .

  • يجب أن تلتزم فقط باستخدام الأحرف اللاتينية فقط (0-9 ، a-z ، A-Z) تقنياً, لا يوجد خطأ لكن عالمياً متعارف علي هذه الحروف فقط.
  • لا يمكنك استخدام حروف اخري لانها سوف يحصل خلل وخطأ في عملية التشغيل لان لغة جافا سكريبت لا تسمح لك باستخدام حروف اخري.
  • لا تستخدم الأرقام في بداية الثوابت. هذا غير مسموح به ويسبب خطأ.
  • لا تستخدم رموز مثل @#%^&*-)( في اسماء الثوابت هذا غير مسموح به ويسبب خطأ.
  • الرمزين المسموح بهما هم علامة ال Dollar sign وعلامة  underscore _.
  • يسمح بكتابة underscore _ سواء في البداية او في منتصف ال name لكن ال underscore _ في البداية يشير الي constructs.
  • يمكن ان يحتوي اسم الثابت Variable علي أحرف وأرقام لا تبدأ اسم الثابت Variable بأرقام.
  • الثوابت حساسة لحالة الأحرف - لذا فإن username ثابت مختلف عن USERNAME.
  • يفضل كتابة الثوابت بحروف كبيرة Capitalize لكي نفرق بينها وبين الثوابت.
  • تحتاج أيضًا إلى تجنب استخدام كلمات JavaScript المحجوزة كأسماء ثوابت - بهذا ، نعني الكلمات التي تشكل البنية الفعلية لجافا سكريبت !  مثل var و function و let و for كأسماء متغيرات او ثوابت. تتعرف المستعرضات عليها كعناصر تعليمات برمجية مختلفة ، وبالتالي ستحصل على أخطاء. هذه قائمة بالاسماء المحجوزه.

هذه نماذج من الاسماء المتطابقه مع الشروط.

const USERNAME= "Ahmed"; 
const USERNAME1 = "Mohamed"; 
const USERNAME2 = "Aly"; 
const _USERNAME = "Khaled"; 
const USER_NAME= "Sameh";
const $USERNAME= "Saleh";

هذه امثلة علي اسماء ثوابت متطابقة مع الشروط العلوية.

const AGE = 22;
const USERNAME = "closetag";
const MYNAME = "Ahmed Aly";
const COLOR = "blue";
const USER_NAME= "Mohamed Adly";
const PASSWORD = 258622;
const EMAIL= "[email protected]";
const EMAILADDRESS= "[email protected]";
const EMAIL_ADDRESS= "[email protected]";
const $EMAIL = "[email protected]";

هذه امثلة علي اسماء ثوابت غير متطابقة مع الشروط العلوية.

const 2 = 10;
const A = 5;
const _12 = "ahmed";
const myage = 25;
const my_age = 25;
const  const = true;
const Document = 10;
const DSFGSFGSDFGDFGSDFGDFGD= "add";
const SDFASDFASDFASDFWERTWERWERWER= "SDFASDFASDFASDFWERTWERWERWER";
const MY AGE = "SDFASDFASDFASDFWERTWERWERWER";

استخدام علاامة الدولار dollar sign مع الثوابت في البدايه وفي النهاية وفي المنتصف.

const $USERNAME= "CloseTag";
const PASSWORD$ = 123;
const U$RL = "www.closetag.com";
document.write("<b>"+  $username +"<b><br>");
document.write("<b>"+  password$+"<b><br>");
document.write("<b>"+  u$rl +"<b>");
  • يجب أن يكون اسم الثابت معنى واضحًا أي أنه يصف البيانات التي يخزنها وتعتبر عملية تسمية الثوابت من أهم المهارات وأكثرها تعقيدًا في البرمجة.
  • يرجى اخذ الوقت الكافي في التفكير في الاسم الصحيح للثابت قبل تسميته. ولفعل ذلك هناك بعض التعليمات التي يمكنك اتباعها.
  • استخدم اسماء يمكن للأشخاص قرائها وفهم معناها.
  • ابتعد عن استخدام الأسماء القصيرة مثل ( A , B , C ) والتي لا تصف البيانات المخزنة بداخلها بأي شكل.
  • من الطرق الآمنة في لغة جافا سكريبت التي يجب الالتزام بها ان تلتزم باستخدام الاحرف الكبيرة في الثوابت Capitalize يفضل ذلك ولكن لا تحدث مشكله اذا كانت حروف صغيرة.
  • بعض الثوابت الغير مسموح بيها يعمل ولكن لايفضل لا يستخدم كحرف ال A.
  • اذا كان هناك خطأ في سطر معين Line في ملف مستند الجافا سكريبت فأنه سوف يؤثر علي بقية الاكواد التي في الصفحة اثناء التشغيل ومن الممكن لن لا تري النتيجة.

</> Declaring constant
تعريف الثوابت في لغة الجافا سكريبت

علي عكس المتغيرات فأن طريقة انشاء الثابت في ال JavaScript  تسمي declaring a constant  يشترط تعيين قيمة عند اعلان الثابت const keyword, وذا قمنا بالاعلان فقط بدون تعيين قيمة الثابت فسوف يحدث خطأ اثناء التشغيل, ايضاً بعكس المتغير لا تعني القيمة في هذة الحالة undefined.

ببساطة شرط عند الاعلان عن الثابت فيجب اضافة قيمة له اذا حدث عكس ذلك ثوف يحدث خطأ برمجياً وسوف يؤثر علي جميع الاوامر البرمجية الاخري.

الاعلان عن ثابت بدون تعيين قيمة في نفس السطر يحدث خطأ شاهدة في ال Console : هذا الخط Uncaught SyntaxError: Missing initializer in const declaration

const WEB_URL;

هذه هي الطريقة الصحيحه للأعلان ثم تعيين قيمة الثابت في نفس السطر.

const WEB_URL = "https://www.closetag.com";
document.write("<b>"+ WEB_URL +"<b>");

نستطيع تعريف مجموعة ثوابت في سطر واحد قد يبدو اقل في عدد السطور, ولكن لا نوصي بهذه الطريقه لانها غير قابلة للقراءه وغير منظمة Not Readable.

const DB_URL = 'localhost', DB_USER= "root", DB_PASSWORD= "toor";

تكتب ايضاً بهذه الطريق بدلاً من استخدام اكثر من مره مفتاح var keyword وهذه طريقة صحيحة ومستخدمة ايضاً.

const DB_URL = 'localhost', 
DB_USER= "root",
DB_PASSWORD= "toor";

</> Declaring constant errors
الاخطاء الناتجه عن اعلان الثوابت

  • يجب تعيين قيمة الثابت الذي تقوم بتحديده ك " const " في نفس الخطوة التي تقوم بأنشائه خلالها.
  • لا يمكن تعديل قيمة الثابت من النوع "const" بعد انشائه وتعيين القيمة الخاصة به.
  • لا يمكنن تغيير نوع اي متغير الي const بعد انشائه.
غير مسموح

في هذه الحالة سوف يحدث خطأ لاننا قمنا بتعريف الثابت دون اضافة او تعيين قيمه له ثم قمنا بتغيير قيمته بعد ذلك فهذا شئ غير منطقي لان القيمه لا تتغير في الثوابت.

const WEB_URL;
WEB_URL = "https://www.closetag.com";
console.log(WEB_URL);
غير مسموح

لا نستطيع تعيين القيم بهذا الشكل لانه سوف يحدث خطأ اثناء التشغيل.

const DB_URL ,DB_URL ,DB_PASSWORD;
غير مسموح

لا نستطيع تعريفها بهذا الشكل ايضاً

const DB_URL ;
const DB_USER;
const DB_PASSWORD;

</> Uppercase constants
الثوابت ذات الأحرف الكبيرة في الجافاسكريبت

هناك قاعدة متعارف عليها بين المبرمجين في معظم لغات البرمجة استخدام احرف كبيرة مع الثوابت فبدلاً من username بحروف صغيرة نستخدم USERNAME باحرف كبيرة وقبلها كلمة const.

استخدم احرف كبيرة عند الاعلان عن الثوابت

const $USERNAME= "CloseTag";
const PASSWORD$ = 123;
const U$RL = "www.closetag.com";

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

const $USERNAME = "CloseTag";
const PASSWORD$ = 123;
const U$RL = "www.closetag.com";

</> Initializing a constant - Initialization
تهيئة او تعين الثابت في لغة جافا سكريبت

تهيئة الثوابت في لغة جافا سكريبت Initializing a constant :

يجب عند انشاء الثابت تعيين القيمة مباشرة حتي لا يحدث خطأ برمجي اثناء التشغيل ولا يمكن اعطاء قيمة اولية ثم تعديلها او تحديث القيمه لاحقاً بعكس المتغيرات variables.

  • يجب علينا عند انشاء الثوابت ان نقوم بعملية تهيئه في نفس الوقت وفي نفس السطر.

يوجد نوعمن التهيئة  Initializing وهناك نوعين منها وهم :

  1. Explicit : تطلق علي المتغيرات والثوابت التي تم تعيين قيمتهم initialization عند وقت انشائها declaration.
  2. implicit :  تطلق علي المتغيرات التي تم انشائها declaration في خطوة تسبق أضافة قيمة بداخلها initialization وهذه للمتغيرات فقط لا تتوافق مع الثوابت. 

Explicit

const WEB_URL = "www.closetag.com";

لا تعمل هذه الطريقة مع الثوابت Implicit

const WEB_UR;
WEB_URL = "www.closetag.com";

</> Arithmetic operators as Constants javascript
العمليات الحسابية مع الثوابت بالجافا سكريبت

لغة ال JavaScript في الثوابت مثل الجبر يمكنك اجراء عمليات حسابية علي الثوابت عن طريق العلامات.

JavaScript Arithmetic Operators  عوامل الجافا سكريبت والثوابت: 

  1. Addition ( + ) : نستطيع جمع ثابتين أو اكثر في لغة جافا سكريبت عن طريق عامل الجمع ويجب الثابت يكون من النوع Number.
  2. Subtraction ( - ) : نستطيع طرح ثابتين أو اكثر في لغة جافا سكريبت عن طريق عامل الطرح ويجب الثابت يكون من النوع Number.
  3.  Multiplication (*) : نستطيع ضرب ثابتين أو اكثر في لغة جافا سكريبت عن طريق عامل الضرب ويجب الثابت يكون من النوع Number.
  4. Division (/) : نستطيع قسمة ثابتين أو اكثر في لغة جافا سكريبت عن طريق عامل القسمة ويجب الثابت يكون من النوع Number.
  5. Modulus (%) : نستطيع ان نحصل علي باقي القسمة بين ثابتين في لغة جافا سكريبت عن طريق عامل النسبة المئوية ويجب الثابت يكون من النوع Number.

عملية الجمع والطرح Addition and subtraction في الثوابت بلغة جافا سكريبت

const PRICE = 1000;
const DISCOUNT = 200;
const SUB_TOTAL = PRICE - DISCOUNT;
const TAX = 14;
const TOTAL = SUB_TOTAL + TAX;
document.write("<b>  Sub Total :  "+ SUB_TOTAL +"<b><br>");
document.write("<b>  Total :  "+ TOTAL +"<b><br>");

عملية الضرب والقسمة Multiplication and Division في الثوابت بلغة جافا سكريبت

const PRICE = 1000;
const DISCOUNT = 200;
const QUANTATIY = 3 ;
const SUB_TOTAL = (QUANTATIY * PRICE ) - DISCOUNT ;
const TAX = 14;
const TERM = (SUB_TOTAL + TAX) / 2;
const TOTAL = TERM ;
document.write("<b>  Sub Total :  "+ SUB_TOTAL +"<b><br>");
document.write("<b>  Total :  "+ TOTAL +"<b><br>");

عملية خارج القسمة او المتبقي بعد قسمة عددين Modulus في الثوابت بلغة جافا سكريبت

const ALL_PRICE = 1000;
const PRODUCTS_NUMBER = 300;
const REMANING = ALL_PRICE % PRODUCTS_NUMBER ;
document.write("<b>  Remaining  :  "+ REMANING   +"<b><br>");

يمكن جمع متغيرين او اكثر اذا كانت القيمة نصوص ففي هذه الحاله لن تتم كعملية حسابية ولكن هي اضافة النصوص بجوار بعضها لبعض باستخدام علامة Addition ( + )

const FIRST_NAME = "Ahmed";
const LAST_NAME = "Hamza";
const FULL_NAME = FIRST_NAME + " " + LAST_NAME ;
document.write("<b>  Full Name Is  :  "+ FULL_NAME +"<b><br>");

</> Declare constant without the const Keyword
انشاء ثابت بدون const Keyword

علي عكس المتغيرات لا يمكن انشاء ثابت بدون الكلمة المفاحية للثوابت const keyword في لغة جافا سكريبت ستحدث مشكلة اثناء التشغيل فيجب عليك ان تبدأ وقت تعريف الثابت بوضع كلمة const في البداية.

هذا ليس ثابت لانك لم تعرفه ب const keyword قبل الاسم فانه في الوضع الحالي يعتبر متغير من النوع var

USERNAME = "closetag";
console.log(USERNAME);
من الضروري عند انشاء الثابت ان تبدأ بكلمة const قبل تعريف الثابت في لغة الجافا سكريبت

</> Hoisting in constants in Java Script
عملية الرفع في الثوابت في لغة جافا سكريبت

في لغة جافا سكريبت في المتغيرات يمكننا ان نضيف قيمه للمتغير قبل عملية التهئية Initialization ثم نقوم بعد ذلك بعملية التهئية دون حدوث اي مشكلة وهذه الحالة تسمي عملية رفع او تعريف Declarations Hoisting اما في الثوابت لا نستطيع فعل ذلك وتسمي هذة الحال Not Hoisting.

Hoisting

car = "Volvo";
document.write(car);
var car;

Not Hoisting

CAR = "Volvo";
console.log(CAR);
const CAR;
معلومات تهمك
  • لا تنسى تقييم الدروس لكي نُحدّث المُحتوى باستمرار حتى ينال إعجابك.
  • لا تنسى مشاركة الموقع مع أصدقاءك حتى تعمّ الفائدة وتكون سبب في نفعهم.
مشاركة
0
0
0
0
عدد المشاركات
هل هذه المعلومات نالت إعجابك ؟
0
0
عدد التقييمات

لديك استفسار ؟

يسعدنا كثيرا مساعدتك في استيعاب افضل للأمور, فلا تترد مطلقا في الاتصال بنا في حال كانت لديك اية اسئله او استفسارات.