سنتناقش فى هذا الفصل “JavaScript Const” تعريف المتغيرات بإستخدام المعرفة const، بالتفصيل مع بعض الأمثلة التوضيحية.


 

JavaScript Const

 

قدم ES6 الكلمة الأساسية const ، والتي تُستخدم لتعريف متغير جديد في JavaScript. بشكل عام ، تُستخدم الكلمة الأساسية var للإعلان عن متغير جافا سكريبت. Const هي كلمة رئيسية أخرى للإعلان عن متغير عندما لا تريد تغيير قيمة هذا المتغير للبرنامج بأكمله.

الثوابت محددة النطاق block-scoped، تشبه إلى حد كبير المتغيرات المُعلنة باستخدام الكلمة الرئيسية let. لا يمكن تغيير قيمة الثابت من خلال إعادة التعيين ، ولا يمكن إعادة تعريفها.

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

متى يتم استخدام const؟ كقاعدة عامة ، قم دائمًا بتعريف متغير باستخدام const إلا إذا كنت تعلم أن القيمة ستتغير.

الكلمة الأساسية const ليست مدعومة في Internet Explorer 10 أو إصدار سابق.

 


 

إعلان وتهيئة متغير Const

 

فيما يلي مثال بسيط عن الإعلان عن متغير ثابت والتهيئة:

const USER_ID = 342000;
console.log(USER_ID); // outputs: 342000

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

 

يجب تعيين قيمة لمتغيرات const عندما يتم التصريح عنها:

const USER_NAME = "Hamed";
console.log(USER_ID); // outputs: Hamed

 

لكن إذا صرحت المتغير أولًا ثم بعد ذلك قُمت بتعيين قيمته، سيعطيك خطأ فى بناء الجملة SyntaxError:

const USER_NAME;
USER_NAME = "Hamed";
console.log(USER_ID); // outputs: SyntaxError

 

نطاق الكتلة – Block Scope

 

متغير const له نطاق كتلة block scope. هذا يعني أنه يمكن إعادة تعيين متغير ثابت داخل نفس البرنامج بنفس الاسم وله قيم مختلفة في كتل مختلفة.

فى المثال التالى، الثابت ID المعلن داخل الـ block، ليس هو نفسه خارج الـ block:

const ID = 300000;
console.log(ID); // outputs: 300000

{
const ID = 200000;
console.log(ID); // outputs: 200000
}

 

إعادة التصريح – Redeclaring

 

يُسمح بإعادة تعريف متغير var في أي مكان في البرنامج. لكن لا يُسمح بإعادة تعريف الـ var أو let الحالي إلى const ، في نفس النطاق، كالتالى:

var PI = 3.14;
const PI = 3.14;
console.log(PI); // outputs: SyntaxError

let PI = 3.14;
const PI = 3.14;
console.log(PI); // outputs: SyntaxError

{
const PI = 3.14;
const PI = 3.14;
console.log(PI); // outputs: SyntaxError
}

 

Const Hoisting

 

بينما يتم رفع المتغيرات المعلنة باستخدام كلمة var (تهيئتها بـ undefined قبل تشغيل الكود) مما يعني أنه يمكن الوصول إليها في نطاقها المرفق حتى قبل إعلانها:

console.log(age); // outputs: undefined

age = 30;
console.log(age); // outputs: 30

var age = 30;
console.log(age); // outputs: 30

 

المتغيرات المعرفة بـ const و let يتم رفعها أيضًا إلى أعلى الـ block، لكن لم تتم تهيئتها (اى استخدام متغير const و let قبل التصريح عنه سيؤدي إلى خطأ مرجعى reference error):

console.log(AGE); // outputs: undefined

AGE = 30;
console.log(AGE); // outputs: 30

const AGE = 30;
console.log(AGE); // outputs: 30

 

الثابت في الكائنات والمصفوفات – Const in objects and arrays

 

يعمل const أيضًا على الكائنات والمصفوفات.

 


 

المصفوفات الثابتة – Constant Arrays

 

في JavaScript ، يسمح لك const بتعديل قيمة المصفوفة فقط ، لكن لا يمكن تغيير المرجع إلى المصفوفة:

// To create a const array:
const DAYS_OF_WEEK = ["Saturday", "Sunday", "Monday", "Tuesday"];

// To change an element:
DAYS_OF_WEEK[1] = "Thursday"; // Thursday Instead of Sunday

// To add New an element:
DAYS_OF_WEEK.push("Wednesday");

 

لا يمكنك إعادة تعيين المصفوفة:

const DAYS_OF_WEEK = ["Saturday", "Sunday", "Monday", "Tuesday"];

DAYS_OF_WEEK = ["Saturday", "Sunday", "Monday", "Tuesday"]; // ❌❌

 

الكائنات الثابتة – Constant Objects



يمكن تغيير خصائص الكائن ولكن لا يمكن تغيير المرجع إلى كائن:

// To create a const object:
const USER_INFO = {id: 4230, name: "Mohammed", age: 40};

// To change an element:
USER_INFO.name = "Essam";

// To add New property:
USER_INFO.email = "essam2021@gmail.com";

 

مثل المصفوفة، لا يمكنك إعادة تعيين الكائن:

const USER_INFO = {id: 4230, name: "Mohammed", age: 40};

USER_INFO = {id: 4230, name: "Mohammed", age: 40}; // ❌❌