variable shadowing در جاوا اسکریپت

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

function func() {    let a = 'vue';        if (true) {        let a = 'vuefarsi';  // اینجا یک مقدار جدید تعریف شده        console.log(a);     }        console.log(a); }func();

توی این کد ما داخل فانکشن اول یک متغیر a تعریف کردیم و مقدار vue رو بهش دادیم. بعد توی if دوباره یک متغیر با همون اسم قبلی یعنی a تعریف کردیم ولی اینبار مقدار vuefarsi رو بهش دادیم. همونطور که می بینید خروجی console.log در if مقدار vuefarsi هست و لاگی که خارج از این بلاک انجام دادیم مقدار vue رو چاپ میکنه. به این میگن variable shadowing. اینجا ما داخل فانکشن یک block scope داریم و داخل if هم یک block scope دیگه داریم. داخل هر scope وقتی متغیری رو تعریف میکنیم (البته اگه از var استفاده نکنیم) فقط داخل همون scope بهش دسترسی داریم. حالا اگه متغیری که داخل if تعریف کردیم رو حذف کنیم console log میره از scope خارجی یعنی a = vue استفاده میکنه. حالا اگه مثلا داخل if بیایم از var استفاده خطای variable already defined رو میگیریم:

function func() {    var a = 'Geeks';    let b = 'Geeks';       if (true) {        var b = 'Geeks'; // مجاز به این کار نیستیم    }}func();

دلیلش اینه که var در سطح function scope تعریف میشه و از اونجایی که توی این اسکوپ ما قبلا b رو تعریف کردیم دوباره نمیتونیم با یه مقدار جدید باز تعریفش کنیم.