17 - جاوااسکریپت: Scope, ES6, let

تعریف scope: جایی که متغیر در کد قابل دسترس است.در نسخه بعدی js به نام es6 یا echma script 2015 روش جدیدی برای ایجاد متغیرها داریم. از کلمه کلیدی let به جای var استفاده میشود.البته از var هم استفاده میشود و جایگزین آن نیست. let به موتور js اجازه میدهد از block scoping استفاده کند. دقیقا مثل var باهاش متغیر ایجاد میکنیم:if (a>b) { let c=true; }برای اینکه از c استفاده کنیم حتما باید به خط کدی که c رو تعریف کرده رسیده باشیم. دومین نکته اینه که داخل یک بلاک تعریف شده. بلاک با { } ایجاد میشود. وقتی متغیر داخل بلاک تعریف میشود، فقط داخل همان بلاک و همان موقع قابل استفاده است. بنابراین اگر یک loop داشته باشیم و داخل اون از let استفاده کنیم، هر دفعه که داخل loop داره اجرا میشه، متغیر جدیدی در حافظه تعریف میشه.18 - جاوااسکریپت: Asynchronous Callbacksتعریف asynchronous: بیشتر از یکی در یک زمان. یعنی چندین کد همزمان با هم اجرا شوند.همان طور که گفتیم js م synchronous است. پس چطور event های asynchronous را مدیریت میکند؟وقتی در مورد اجرای js یا موتور js صحبت میکنیم، میدانیم که چنین چیزی خودش در بروزر وجود ندارد. موتورها یا المنت های دیگری هستند که کدهایی را اجرا میکنند بیرون از موتور js تا js وقتی در بروزر لود میشود اجرا شود. چیزهایی مثل rendering engine که screen وبسایتی را که به آن نگاه میکنیم render یا print یا paint میکند. همچنین المنتهایی در بروزر وجود دارد که پاسخ های http request ها را میگیرند.همه اونچه اجرا میشه ممکنه در بروزر asynchronous باشه (یعنی rendering engine و js engine و http request با هم اجرا میشوند) ولی اونچه که فقط داخل موتور js اجرا میشه synchronous هست.بنابراین میتونیم به صورت همزمان از موتور js بیرون بریم و سراغ request بریم یا بخوایم که تابعی موقع کلیک روی دکمه ای اجرا بشه.علاوه بر استک مربوط به execution context ها یک لیست دیگه هم در موتور js وجود داره که به آن event queue گفته میشه. این صف پر از نوتیفیکیشن های event است. بنابراین وقتی که بروزر جایی خارج از موتور js یک event داشته باشد که بخواهیم داخل موتور js از آن مطلع بشیم، در این صف قرار میگیرد. اگر تابعی داشته باشیم که لازم باشد به آن پاسخ بدهد، باید به آن event گوش دهیم.میخواهیم بدانیم اگر تابعی برای پاسخ به event داشته باشیم چه اتفاقی میفته. مثلا یک event به اسم click داریم و یکی دیگه به اسم http request. اونچه اتفاق میفته اینه که event queue وقتی توسط js نگاه میشه که استک js خالی شده باشه. اگر چیزی داخل event queue ببیند، چک میکند آیا موقع trigger شدن آن event تابع خاصی باید اجرا شود یا نه. سپس برای آن تابع یک execution context ایجاد میکند و وقتی event انجام میشود از صف پاک میشود و همین کار ادامه پیدا میکند تا صف event ها خالی شود.پس واقعا asynchronous نیست. اونچه اتفاق میفته اینه که بروزر به صورت asynchronous چیزها رو داخل event queue میگذاره. اما کدی که اجرا میشه به صورت خط به خط اجرا میشه. برای مثال در کد زیر:function waitThreeSeconds() { var ms = 3000 + new Date().getTime();while ( new Date()<ms ) { }console.log('finished function');}function clickHandler() { console.log('click event'); }document.addEventListener('click', clickHandler);waitThreeSeconds();console.log('finished execution');اجرای تابع waitThreeSeconds سه ثانیه طول میکشه. اگر در این حین روی صفحه کلیک کنیم، بروزر این click event را در event queue قرار میدهد. خروجی به ترتیب میشه:finished functionfinished executionclick eventجاوااسکریپت وقتی به event queue نگاه میکنه که استکش خالی باشه. پس حتی اگر اجرای کدمون طول بکشه باز هم event ها مدیریت میشن. بنابراین asynchronous callback در js ممکن است ولی asynchronous بیرون از موتور js انجام میشود.