اگر وقت کنم چیزایی که یاد گرفتم رو می نویسم
تفاوت بین var , let و const
با اومدن es6 تعریف متغیر در جاوا اسکریپت تغییر کرد و یه کلید واژه به اسم let وارد جاوا اسکریپت شد
فرق const با اون دو تای دیگه که مشخصه const همون طور که از اسمش پیداست یک مقدار ثابت هستش و طی برنامه نمی شه مقدارش رو تغییر داد
ولی فرق های let و var :
برای فهمیدن تفاوت های let و var باید یکم بیشتر راجع به scope ها بدونید در زمان های دور (es5) دو نوع scope داشتیم
یا Global Scope بود یا Function Scope از اسمشونم معلومه چیه دیگه یا مقادیر داخل function ها تعریف می شدن یا به صورت عمومی (که تعریف همچین متغییر هایی به دلیل پرفرمنس جیز بود و نباید انجامش می دادیم )
وقتی که es6 اومد یه Scope جدید با خودش آورد به اسم Block Scope حالا بریم ببینیم فرقشون چیه
نکته : در جاوااسکریپت هر {} یک بلوک محسوب می شود پس هر کدی که داخل {} قرار بگیرد داخل یک بلوک کد است لازم به ذکر است که Function Scope یک حالت خاص از Block Scope می باشد در واقع function Scope همان Block Scope است که به صورت function تعریف شده باشد
نکته 2 : هر function Scope قطعا یک Block Scope است ولی لزوما همه Block Scope ها Function Scope نیستند
تیکه کد پایین رو در نظر بگیرید
var a = 40
if(a > 10){
var a = 42;
}
console.log(a);
//output : 42
به این می گن Global Scope یعنی به صورت عمومی در دسترس هستش که خب استفاده کردن ازش همچنان جیزه :)
حالا اینو ببینید
let a = 40;
if(a > 10){
let a = 42;
}
console.log(a);
//output : 40
بیاین یه مثال ملموس تر بزنیم که هم Function Scope استفاده کرده باشیم هم block Scope
کد پایین رو ببینید
function (){
let a = 11;
var b = 12
if(a > 10 ){
let a = 9;
var b = 15;
console.log("first log a " , a);
console.log("first log b" , b);
}
console.log("second log a" , a);
console.log("second log b" ,b);
//output :first log a 9
//output :first log b 15
//output :second log a 11
//output :second log b 15
}
چی شد ؟
اساسی ترین فرق let و var همین هستش که let حوزش Block Scope هستش و var حوزش Function Scope
یعنی شما اگر مقداری که با let تعریف کردین داخل یه بلوک دیگه (مثل if , else , loop و ...) مجدد با همون نام تعریفش کنید و مقدار بهش بدین بیرون بلوک انگاری که هیچ کاری نکردین و تاثیری روی مقدار بیرون بلوک نخواهد داشت
یه تفاوت دیگه هم let و var دارند
شما می تونی داخل حوزه var مجدد با همون نام مقدار تعریف کنی ولی با let نمی تونی یعنی چی ؟
کد پایین رو ببین :
function (){
var a = 10;
var a = "Hello World !"
console.log(a);
//output : Hello World !
}
ولی :
function (){
let a = 10;
let a = "Hello World !"
console.log(a);
//output : SyntaxError: Identifier 'a' has already been declared
}
لازم به ذکره تمامی رفتار های const کاملا مشابه let هستش با این تفاوت که let طی برنامه می تونه مقدار دیگه ای براش جایگذین بشه ولی مقدار const قابل تغییر نیست یعنی :
function (){
const a = 10 ;
a = "Hello World !"
//output : TypeError: Assignment to constant variable.
}
ولی :
function (){
let a = 10 ;
a = "Hello World !"
console.log(a)
//output : Hello World !
}
آقا داود
امیدوارم مفید باشه :)
مطلبی دیگر از این انتشارات
شبه المنت ها و شبه کلاس ها در css
مطلبی دیگر از این انتشارات
بهترین منبع یادگیری جاوااسکریپت
مطلبی دیگر از این انتشارات
Event Capturing و Event Bubbling در جاوااسکریپت