دامنه (Scope)
در جاوااسکریپت، «دامنه (Scope)» یعنی محدوده دید متغیرها. هر جا تعریف شوند، همان جا دیده می شوند. پس اگر جای تعریف اشتباه باشد، باگ می گیری.
دامنه یعنی دید
سه مدل دامنه داریم: سراسری، تابع، و بلوک. «سراسری (Global)» یعنی همه جا. «تابع (Function)» یعنی فقط داخل تابع. «بلوک (Block)» یعنی داخل { }.
دامنه سراسری (Global Scope)
متغیر خارج از هر تابع یا بلوک، سراسری است. با var و let و const در بیرون، همه سراسری می شوند.
var x = 1;
let y = 2;
const z = 3;
متغیر سراسری از هرجای برنامه قابل دسترسی است.
let carName = "Volvo";
function myFunction() {
// می توان به carName دسترسی داشت
}
دامنه تابع (Function Scope)
هر تابع، محدوده خودش را دارد. متغیرهای داخل تابع بیرون دیده نمی شوند.
function myFunction1() {
var carName = "Volvo";
}
function myFunction2() {
let carName = "Volvo";
}
function myFunction3() {
const carName = "Volvo";
}
// اینجا carName در دسترس نیست
function myFunction() {
let carName = "Volvo";
// اینجا carName در دسترس است
}
// دوباره اینجا carName در دسترس نیست
دامنه بلوک (Block Scope)
از ES6، let و const داخل { } فقط همان جا دیده می شوند. این کار جلوی تداخل نام ها را می گیرد.
{
let x = 2;
}
// اینجا x در دسترس نیست
اما var «بلوک محور» نیست. پس بیرون بلوک دیده می شود.
{
var x = 2;
}
// اینجا x در دسترس است
سراسریِ خودکار (Automatically Global)
اگر به متغیر اعلام نشده مقدار بدهی، سراسری می شود. این کار خطرناک است.
myFunction();
function myFunction() {
carName = "Volvo";
}
// اینجا carName سراسری است
حالت سخت گیرانه (Strict Mode)
در «Strict Mode»، متغیرِ اعلام نشده خودکار سراسری نمی شود. این حالت از خطاهای پنهان جلوگیری می کند.
متغیرهای سراسری در HTML (window)
در صفحات HTML، ناحیه سراسری همان window است. var به window متصل می شود؛ let متصل نمی شود.
var carName = "Volvo";
// می توان از window.carName استفاده کرد
let carName = "Volvo";
// window.carName در دسترس نیست
عمر متغیرها
عمر متغیر با اعلام شروع می شود. متغیرهای تابع پس از پایان تابع حذف می شوند. متغیرهای سراسری با بستن تب مرورگر پاک می شوند.
گام های عملی
- یک متغیر سراسری بساز و در کنسول بخوان.
- همان نام را داخل تابع با let بساز.
- تفاوت دید سراسری، تابعی، و بلوکی را بررسی کن.
جمع بندی سریع
- سراسری یعنی همه جا؛ مراقب تداخل باش.
- تابع، محدوده خودش را دارد.
- بلوک با let و const محدود می شود.
- var بلوکی نیست؛ احتیاط کن.
برای ادامه، رویدادها را ببین. سپس به بالا بردن (Hoisting) برو تا رفتار اعلام ها را بهتر درک کنی.
نکته: درباره ES6 بیشتر خواستی، صفحه ES6 را ببین.