با تفاوت بین کلمات کلیدی var، let و const در جاوا اسکریپت و زمان استفاده از آنها آشنا شوید.

var، let و const: تفاوت در جاوا اسکریپت چیست؟

جاوا اسکریپت یک زبان پویا و انعطاف پذیر است که به شما امکان می دهد متغیرها را به روش های مختلف اعلام کنید. می توانید از کلمات کلیدی var، let یا const برای تعریف متغیرها در جاوا اسکریپت استفاده کنید، اما تفاوت آنها چیست و چه زمانی باید از آنها استفاده کنید؟

در این مقاله با تفاوت کلمات کلیدی var، let و const در جاوا اسکریپت و برخی از مزایا و معایب آنها آشنا خواهید شد.

متغیر چیست؟

متغیر محفظه ای برای ذخیره اطلاعات است. می توانید از یک متغیر برای ذخیره یک مقدار استفاده کنید، مانند یک عدد، یک رشته، یک بولی، یک شی یا یک تابع. همچنین می توانید از یک متغیر برای اشاره به مقداری استفاده کنید که ممکن است در طول زمان تغییر کند.

برای اعلام یک متغیر در جاوا اسکریپت، باید از یک کلمه کلیدی و به دنبال آن یک نام برای متغیر استفاده کنید. مثلا:

var x = 10; // یک متغیر را با استفاده از var اعلام کنید
اجازه دهید y = 20; // یک متغیر را با استفاده از let اعلام کنید
const z = 30; // یک متغیر را با استفاده از const اعلام کنید

نام متغیر باید از قوانینی پیروی کند:

• باید با یک حرف یا $ یا _ شروع شود.

• نمی تواند حاوی فاصله یا علائم نگارشی باشد (به جز $ و _).

• نمی تواند یک کلمه رزرو شده در جاوا اسکریپت باشد، مانند var، let، const، if، for و غیره.

• به حروف بزرگ و کوچک حساس است، به این معنی که x و X متغیرهای متفاوتی هستند.

تفاوت بین var، let و const چیست؟

تفاوت اصلی بین var، let و const این است که چگونه بر دامنه و افزایش متغیرها تأثیر می گذارند.

محدوده
محدوده یک متغیر بخشی از کد است که در آن می توان به متغیر دسترسی پیدا کرد یا از آن استفاده کرد. در جاوا اسکریپت دو نوع دامنه وجود دارد: دامنه جهانی و دامنه محلی.

• دامنه جهانی: متغیری که در دامنه جهانی اعلام شده است از هر نقطه کد قابل دسترسی است. متغیری که خارج از هر تابع یا بلوکی اعلام شده است در محدوده جهانی قرار دارد.

• محدوده محلی: متغیری که در محدوده محلی اعلام شده است فقط در داخل تابع یا بلوکی که در آن تعریف شده است قابل دسترسی است. یک متغیر اعلام شده در داخل یک تابع یا بلوک در محدوده محلی است.

دامنه متغیری که با var اعلام شده است یا سراسری است یا مبتنی بر تابع. این بدان معناست که اگر متغیری را با var در داخل یک تابع اعلام کنید، فقط در آن تابع قابل دسترسی است. با این حال، اگر متغیری را با var در داخل یک بلوک اعلام کنید (مانند یک دستور if یا یک حلقه for)، خارج از آن بلوک نیز قابل دسترسی است.

مثلا:

function foo() {
var x = 10; // Declare x with var inside foo function
if (true) {
var y = 20; // Declare y with var inside if block
console.log(x); // 10 (x is accessible inside if block)
console.log(y); // 20 (y is accessible inside if block)
}
console.log(x); // 10 (x is accessible outside if block)
console.log(y); // 20 (y is accessible outside if block)
}

foo();

console.log(x); // ReferenceError: x is not defined (x is not accessible outside foo function)
console.log(y); // ReferenceError: y is not defined (y is not accessible outside foo function)

دامنه متغیری که با let یا const اعلام شده است مبتنی بر بلوک است. این بدان معناست که اگر متغیری را با let یا const در داخل هر بلوکی (مانند یک تابع، یک دستور if یا یک حلقه for) اعلام کنید، فقط در آن بلوک قابل دسترسی است.

مثلا:

function foo() {
let x = 10; // Declare x with let inside foo function
const z = 30; // Declare z with const inside foo function
if (true) {
let y = 20; // Declare y with let inside if block
console.log(x); // 10 (x is accessible inside if block)
console.log(y); // 20 (y is accessible inside if block)
console.log(z); // 30 (z is accessible inside if block)
}
console.log(x); // 10 (x is accessible outside if block)
console.log(y); // ReferenceError: y is not defined (y is not accessible outside if block)
console.log(z); // 30 (z is accessible outside if block)
}

foo();

console.log(x); // ReferenceError: x is not defined (x is not accessible outside foo function)
console.log(y); // ReferenceError: y is not defined (y is not accessible outside foo function)
console.log(z); // ReferenceError: z is not defined (z is not accessible outside foo function)

استفاده از محدوده مبتنی بر بلوک می تواند از نشت تصادفی و درگیری متغیرهایی با نام یکسان در بلوک های مختلف جلوگیری کند.

بالا بردن
Hoisting مکانیزمی در جاوا اسکریپت است که اعلان های متغیرها را قبل از اجرای هر کدی به بالای محدوده آنها منتقل می کند. این به این معنی است که شما می توانید از یک متغیر قبل از اعلام استفاده کنید، اما مقدار اولیه آن تعریف نشده است.

بالا بردن به طور متفاوتی برای متغیرهای اعلام شده با var، let و const اعمال می شود.

متغیرهای اعلام شده با var در بالای محدوده خود، چه سراسری یا مبتنی بر تابع، بالا می روند. این بدان معنی است که شما می توانید قبل از اعلام آنها از آنها استفاده کنید، اما مقدار اولیه آنها تعریف نشده است.

مثلا:

console.log(x); // تعریف نشده (x افزایش یافته است اما اولیه نشده است)
var x = 10;
console.log(x); // 10

متغیرهای اعلام شده با let یا const نیز در بالای محدوده خود قرار می گیرند، اما تا زمانی که اعلان نشده باشند، مقداردهی اولیه نمی شوند. این بدان معناست که شما نمی توانید قبل از اعلام آنها از آنها استفاده کنید و با خطای مرجع مواجه خواهید شد.

مثلا:

console.log(x); // ReferenceError: Cannot access 'x' before initialization (x is hoisted but not initialized)
let x = 10;
console.log(x); // 10

console.log(y); // ReferenceError: Cannot access 'y' before initialization (y is hoisted but not initialized)
const y = 20;
console.log(y); // 20

این رفتار یک منطقه مرده موقتی بین hoisting و مقداردهی اولیه متغیرهای اعلام شده با let یا const ایجاد می کند. این می تواند از خطاها جلوگیری کرده و شیوه های کدگذاری خوب را اعمال کند.

چه زمانی از var، let و const استفاده کنیم؟
همانطور که مشاهده کردید، استفاده از var، let و const برای اعلان متغیرها در جاوا اسکریپت دارای مزایا و معایبی است. پس چه زمانی باید از آنها استفاده کنید؟

توصیه کلی این است که از استفاده از var خودداری کنید مگر اینکه دلیل خاصی برای این کار داشته باشید. استفاده از var می تواند باعث سردرگمی و خطا به دلیل دامنه عملکرد و رفتار بالابر آن شود.

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

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

• یک مقدار اولیه مانند یک عدد یا یک رشته.

• ارجاع به یک شی یا آرایه ای که همیشه به همان شی یا آرایه اشاره می کند.

• یک عبارت تابع یا یک تابع فلش.

زمانی که می خواهید متغیری را که ممکن است در طول زمان تغییر کند، اعلام کنید، باید از let استفاده کنید، مانند:

• شمارنده یا تکرار کننده در یک حلقه.

• یک مقدار موقت در یک الگوریتم.

• یک مقدار تخصیص شرطی در یک عبارت if-else.

در اینجا چند نمونه از استفاده از let و const آورده شده است:

// Use const for primitive values that will not change
const PI = 3.14;
const NAME = "John";

// Use const for references to objects or arrays that will always point to the same object or array
const person = {name: "John", age: 25};
const numbers = [1, 2, 3];

// Use const for function expressions or arrow functions
const add = function(a,b) {
return a + b;
};

const multiply = (a,b) => {
return a * b;
};

// Use let for counters or iterators in loops
for (let i = 0
i < 10; i++) {
console.log(i); // 0, 1, 2, ..., 9
}

// Use let for temporary values in algorithms
let a = 10;
let b = 20;
let temp = a; // Use temp to swap the values of a and b
a = b;
b = temp;

// Use let for conditionally assigned values in if-else statements
let greeting;
if (hour < 12) {
greeting = "Good morning";
} else {
greeting = "Good afternoon";
}

console.log(greeting); // Depends on the value of hour

نتیجه

در این مقاله با تفاوت بین آنها آشنا شدید var، let، و const کلمات کلیدی در جاوا اسکریپت و زمان استفاده از آنها یاد گرفتی که:

• var متغیری را با دامنه تابع یا دامنه جهانی اعلام می‌کند و با مقدار اولیه آن به بالای محدوده آن بالا می‌رود. undefined.

• let و const متغیرها را با محدوده بلوک اعلان می کنند، و آنها را تا بالای محدوده خود بالا می برند، اما تا زمانی که اعلان نشده باشند، مقداردهی اولیه نمی شوند.

• باید از مصرف خودداری کنید var مگر اینکه دلیل خاصی برای این کار داشته باشید و استفاده کنید let یا const بجای.

• باید استفاده کنید const وقتی می خواهید مقدار ثابتی را که تغییر نمی کند اعلام کنید و از آن استفاده کنید let زمانی که می خواهید متغیری را اعلام کنید که ممکن است در طول زمان تغییر کند.

امیدوارم این مقاله به شما در درک تفاوت بین آنها کمک کند var، let، و const در جاوا اسکریپت اگر سؤال یا بازخوردی دارید، لطفاً در زیر نظر دهید. با تشکر برای خواندن! سرخ شدن