Friday 29 December 2023
Understanding Rest & Spread operator in Javascript
Closures in Javascript
Background
Closures in Javascript
It's important to note that it is not just a function but a combination of function + referenced to its lexical environment.
Let's take a simple example:
(() => { var name = "Aniket"; const displayName = () => { console.log(name); } displayName(); })()
The (()=>{})() is a self-executing function. Inside it, you can see an anonymous function defined using the arrow operator. Inside this function, we have defined a variable called name and again an anonymous function called displayName which prints the name variable in the console.
What is interesting to note here is that even though the variable name is local to the outermost anonymous function we can still access it inside the displayName method, this is possible due to closures. When we created an anonymous function & assigned it to the displayName const variable it actually created a closure that comprised of the function itself + the reference to the lexical environment which includes the name variable defined in the outer scope.
NOTE: Nested functions have access to variables declared in their outer scope.
Understanding scopes
Here check variable even though was defined inside the if block has become a global scoped variable (Unlike other languages like Java where it would have created a local scoped variable).
- let - defines a variable local to the scope
- const - defines a constant variable again local to the scope.
Interesting examples
Now let's see some interesting examples before we wind this up.
See the below examples & predict the output
const myName = ["Aniket", "Abhijit", "Awantika"]; for(var i; i<myName.length;i++) { setTimeout(function(){ console.log('Name: ' + myName[i] + 'at index:' + i); },3000) }
The output is
It prints undefined as Name & index as 3 all the three times the loop executes. Let's try to understand why this happened: When we pass a custom function inside setTimeout it creates a closure of the function bundled with the captured environment from the out functions scope. Three closures are created by the loop but each shares the same lexical environment which has the variable "i" with changing values. This is because the "i" variable is defined as var and has a global scope. The value of "i" in the passed function is determined when it is actually executed after the timeout completes (when it comes from the event loop). Since the loop has already been completed by the time these closures from the event loop are executed "i" points to 3 and there is no such index in that array as the size is 3 and the index range from 0 to 2. Hence it prints "i" as 3 and the name as "undefined" three times - one for each closure created in the loop.
You can fix this by using a wrapper function to be passed inside setTimeout API argument which will create its own closure with the actual local value of "i" and pass it to the event table instead of just the original closure which is pointing to global scoped "I". Eg see below where I have given two ways one using function keyword and one using anonymous function
Or you could simply change var to let in the for loop which will create a block-scoped variable instead of a global scope and changes will still work fine.
Related Links
Sunday 2 October 2022
How to fix Apostrophes and double quotes not showing up in Windows
Background
Recently I started using Windows 11 and realized Apostrophes (Single quotes) and double quotes not showing up until I type in the next letter. This behavior is really annoying, especially for me (I am from India/Asia) if you are wondering 😄 . This is most probably because you are using a US-international keyboard. In this post, I will show you how to fix this behavior.
Fixing "Apostrophes and double quotes not showing up in Windows"
As I mentioned before the issue is with you using the US-international keyboard. So you need to fix that.
I am using "Windows 11" so the below steps are keeping that in mind, but you would have similar steps in another version of Windows.
- Select Start > Settings > Time & language > Language & region.
- Under Preferred languages, select the options from 1st language you are using and click on "Language Options".
- Next, go under "Keyboards", here you will see the "US-International" keyboard installed. We need to remove this.
- Let's add the Keyboard we intend to use 1st. I am adding English (India) but you can choose the keyboard you want (Let's say English (United Kingdom)).
- Now select "US-International" keyboard from the list.
- Changes should immediately take effect.
Related Links
How to move TaskBar to the top or side in Windows 11
Background
How to move TaskBar to the top or side in Windows 11
- Open "Windows Start" and search for "regedit" OR
- Go to "Run" (using ⊞ Win+R) and type "regedit" and press enter.
- You will get a prompt asking if you want to let the current user make changes to "Registry Editor". Press Ok.
- Next from the left hierarchy panel, you need to go to the following entry:
HKEY_CURRENT_USER\Software\Microsoft\Windows\CurrentVersion\Explorer\StuckRects3
- Double-click the Settings binary key.
- Under "Value data" section click on the entry with the 2nd row and the 6th column (The default value would be 03).
- Press the delete key and replace it with the 01 value to move the taskbar to the top. Press ok.
- You can replace them with the following values as you desire
- 00: Move the Taskbar to the left
- 01: Move the Taskbar to the top
- 02: Move the Taskbar to the right
- 03: Move the Taskbar to the bottom
- For changes to take effect you need to restart the "Windows Explorer" process.
- You can go to "Task Manager" and restart the "Windows explorer" process. OR
- Do it via "Command prompt" via the following commands.
- Open the command prompt from the start menu or from the run menu(⊞ Win+R) and "cmd" command.
- "taskkill /f /im explorer.exe"
- "start explorer.exe"
Thursday 29 April 2021
How to fix issue of not able to click anything on Windows 10
Background
- Restart PC
- Restart File Explorer
- Use sfc (system file scanner)
Restart PC
Restart File Explorer
- Ctrl + Alt + Delete
- Ctrl + Shift + Escape
Use Systems file checker (SFC)
- sfc /scanall
And the best part - No reboot required. This does take a couple of mins. But you can try browsing or something else at that time :)