زمان مطالعه:5 دقیقه

تعریف متغیر با const در جاوااسکریپت چیست و چه ویژگی هایی دارد ؟

تعریف متغیر با کلمه const در جاوااسکریپت یک متغیر بلاک اسکوپ محلی ( block-scoped local variables ) ایجاد میکنه و مقدار متغیر ایجاد شده با کلمه const بر خلاف let و var بصورت مستقیم از طریق عملگر = قابل تغییر نیستند و فقط زمانی ما میتونیم مقدار متغیرهای const رو تغییر بدیم که به عنوان مثال مقدار اون متغیر برابر یک object یا array باشه و در اون صورت هم فقط میتونیم عضو ها و property های اون array یا object رو تغییر بدیم. ( مثل حذف، افزودن یا پاک کردن )

const number = 42;

try {
  number = 99;
} catch (err) {
  console.log(err);
  // Expected output: TypeError: invalid assignment to const `number'
  // (Note: the exact output may be browser-dependent)
}

console.log(number);
// Expected output: 42

سینتکس تعریف متغیر با کلمه const در جاوااسکریپت

const name1 = value1;
const name1 = value1, name2 = value2;
const name1 = value1, name2 = value2, /* …, */ nameN = valueN;

همچنین امکان Destructuring هم برای متغیرهایی که مقدارشون برابر با یک object هست هم وجود داره، مثل نمونه زیر:

const foo = {
  bar:10,
  baz:12,
}

const { bar } = foo; // where foo = { bar:10, baz:12 };
/* ba inkar engar darim yek variable jadid ba name bar injad mikonim */

متغیرهای const شباهت زیادی به هم به متغیرهای let دارن:

const ها هم محدود به block و function هستند
const ها فقط بعد از خط کدی که در اون تعریف شدن قابل دسترس هستند و برخلاف متغیرهای var به بالای scope منتقل نمیشن ( hoist نمیشن )
هیچ ویژگی را به globalThis اضافه نمیکنند.
const ها نمیتونن در یک بلوک مجددا بصورت تکراری تعریف بشن
متغیرهای const باید موقع تعریف شدنشون مقداردهی هم بشن وگرنه ارور ایجاد میکنن
```
const FOO; // SyntaxError: Missing initializer in const declaration
```

متغیرهایی که با کلمه const در جاوااسکریپت ایجاد میشن یک مرجع ( reference ) تغییر ناپذیر به یک مقدار ایجاد میکنن. البته این بدان معنا نیست که مقدار این متغیرها غیرقابل تغییرند، بلکه منظور از ایجاد یک مرجع تغییر ناپذیر به یک مقدار این هست که شناسه این متغیرها غیرقابل تغییرن و به عنوان مثال اگر مقدار یک متغیر const برابر با یک object باشه ما میتونیم محتوای اون object رو تغییر بدیم. بنابر این این مورد رو به خاطر داشته باشید که کلمه const متغیری ایجاد میکنه که هویت و شناسه اون متغیر بدون تغییر و ثابت باقی میمونه نه مقدار اون متغیر!

خیلی از منابع و جوامع برنامه نویسی توصیه میکنند که هنگام تعریف متغیرها در جاوااسکریپت ، اگر قرار نیست مقدار اون متغیر در scope خودش با عملگر = تغییر کنه از کلمه const بجای let استفاده بشه و این یجورایی یک قرارداد و اصولی از clean code هست و هم خوانایی کد رو بهتر میکنه و هم خیلی از مواقع صحت و سلامت کارکرد کد رو گارانتی میکنه.

چند مثال از متغیرهای const

نام گذاری متغیرهای const:

در نام گذاری متغیرهای ایجاد شده با کلمه constمیتونیم هم از حروف بزرگ استفاده کنیم و هم حروف کوچک ولی یک توافق و قرارداد رایجی وجود داره که توصیه میکنه در نامگذاری متغیرهای const تماما از حروف بزرگ استفاده بشه تا غیرقابل تغییر بودن اون متغیر رو نشون بده

const MY_FAV = 7;

console.log("my favorite number is: " + MY_FAV);

تعریف مجدد:

همچنین مقداردهی مجدد با عملگر = و یا تعریف مجدد یک متغیر const در scope فعلی هم باعث ایجاد ارور میشن

// Re-assigne kardan yek const error ijad mikone
MY_FAV = 20; // TypeError: Assignment to constant variable

// tarife mojadade yek const error ijad mikone
const MY_FAV = 20; // SyntaxError: Identifier 'MY_FAV' has already been declared
var MY_FAV = 20; // SyntaxError: Identifier 'MY_FAV' has already been declared
let MY_FAV = 20; // SyntaxError: Identifier 'MY_FAV' has already been declared

block-scope بودن این متغیرها:

مهمه که مفهوم block-scope بودن یک متغیر را درک کنیم و بدونیم که دقیقا block-scope بودن یک متغیر به چه معنی هستش، به مثال زیر توجه کنید:

const MY_FAV = 7;

if (MY_FAV === 7) {
  // This is fine because it's in a new block scope
  const MY_FAV = 20;
  console.log(MY_FAV); // 20

  // var declarations are not scoped to blocks so this throws an error
  var MY_FAV = 20; // SyntaxError: Identifier 'MY_FAV' has already been declared
}

console.log(MY_FAV); // 7

در مثال بالا ما ابتدا یک const با نام MY_FAV ایجاد کردیم که مقدار اون برابر با 7 هست و در داخل بدنه شرطی که نوشتیم مجددا متغیری با همان نام MY_FAV ایجاد کردیم که اینبار مقدار اون برابر با 20 هست و هردوی این متغیرها بدون هیچگونه خطایی خوانده و اجرا میشن و دلیلشم این هست که بدنه شرط ما و کدی که بین { } هست یک scope جدید و مجزا حساب میشه و از اونجایی که متغیرهای const محدود به بلوکی که توی اون تعریف شدن هستند ما شاهد هیچگونه اروری نخواهیم بود. اما متغیرهای var برخلاف const ها block-scope نیستن و همانطور که در بالا میبینید متغیری که با نام MY_FAV و با کلمه var تعریف شده بدلیل تکراری بودن اون متغیر باعث ایجاد ارور شده!

object و array در متغیرهای const

قبلتر گفتیم که نمیتونیم بصورت مستقیم و با عملگر = مقدار یک const را تغییر بدیم اما درصورت object یا array بودن مقدار اون متغیر میتونیم محتوای اون object یا array را بصورت زیر تغییر بدیم:

// baraye object ha besoorate zir
const MY_OBJECT = { key : "value"};

MY_OBJECT.key = "otherValue";

console.log(MY_OBJECT);
// { key: "otherValue" };

// va baraye arraye ha ham besoorate zir
const MY_ARRAY = [];

MY_ARRAY.push("A");

console.log(MY_ARRAY);
// ["A"]

و به عنوان کلام پایانی این نکته رو هم به خاطر داشته باشید که اگر خواستید حتی محتوای object خودتون رو هم غیرقابل تغییر کنید باید از Object.freeze() استفاده کنید.

سینتکس تعریف متغیر با کلمه const در جاوااسکریپت

چند مثال از متغیرهای const

نظرات