JS INTERNALS: Hoisting, STARVATION, PROTOTYPE

Quick Question : does VAR, LET , CONST have hoisting property???

Hoisitng - a variable/ function is called before its declaration

VAR - Yes, it support hoisting

LET, CONST - NO, it doesn't support hoisting (that's my response, and its not wrong completely.). It does support hoisting but its restricted due to a concept known as TBZ.

Temporal Dead Zone: Before excuting code JS tends to allort MEMORY to all of the variable it could find in the code. in VAR it can access the variable that are declared in early phase but in the case of LET & CONST it doesn't allow it access it. That cause it not support hoisting.

key part is the MEMORY ALLOCATION phase before executing code.

What is STARVATION in JS

by defination- when low priority tasks doesn't get chance to get resolve because high priority tasks keep flooding the task queue.

now What happens internally:

• Every code in JS go through EVENT LOOP. what happens internally that in memory every code is divided into priority based tasks:

high priority- synchronous code(ex- normal logs, functions) stored in Execution Context

medium priority - micro task(ex- promises) stored in Task Queue

low priority - macro tasks(ex- setTimeout, setIntervals) stored in MacroTasks Queue

when a code is executed in JS

console.log("1. Synchronous Start"); //this is out syncronous code

setTimeout(() => {
  console.log("4. setTimeout (Macrotask)");
}, 0);

Promise.resolve().then(() => {
  console.log("3. Promise.then (Microtask)");
});

console.log("1. Synchronous End");

flow goes like this 1> Execution Context 2> MacroTasks Queue 3> Tasks Queue

Now , lets say what will happen if the whole process get stucked in MacroTasks Queue:

setTimeout(() => {
  console.log("Macro Tasks");
}, 0);

function infiniteMicrotasks() {
  Promise.resolve().then(() => {
    console.log("Microtask Running");
    infiniteMicrotasks(); 
  });
}
infiniteMicrotasks(); //whole code is stucked here because of Macrotasks queue

what happened here:

Each microtask creates another microtask
↓
Microtask Queue never becomes empty
↓
Event loop never reaches Macrotask Queue
↓
setTimeout never executes

This condition is called STARVATION because whole code is stucked because of macrotasks never get emptied and the macrotasks never gets chance to be resolved.

JAVASCRIPT : Prototype Behaivour

Now lets talk about Javascript internal behaivour which is Almost everything in JavaScript behaves like an object or can access object behavior through prototypes.

Whys that because whatever we define in javascript either its a function , Array, String evrything eventually goes through object which contains it prototypal behaivour and javascript tends to parse into it untill it finds a object null.

well for example do This:

const arr = [1, 2, 3, 4];
console.log(arr);


and see there is a [prototype] at the end of every result and as u parse into it u will eventually find proto and further into it u will find null, only thats when it gets over.

this prototype property help in injecting custom functionality into our desired Array, Object, String, like this:

`
const arr = [1,2,3,4,5];

Array.prototype.myFilter = function() {
let newArr = [];

for(let i = 0; i < this.length; i++){
if(i > 2) newArr.push(this[i]);
}

return newArr;
};

console.log(arr.myFilter()); //[3,4,5]
`
arr
↓
Array.prototype
↓
Object.prototype
↓
null

with this custom method u could access this property throughout the array without redefining them, again and again

And what this proto do , proto points to the object from which another object inherits properties and methods:

`const obj1 = { name: "khanjan", age: 21 };

const obj2 = { name: "jha" };

obj2.proto = obj1;

console.log(obj2.age); // 21`

internal lookup:

obj2.age
↓
not found in obj2
↓
search obj2.proto
↓
found in obj1

like here we can give the refrence of obj1 to obj2 and get the value from obj1.

UMMM... i tried my best to explain whatever i learned about the JS internals here and i am still learning more about polifills and Js prototypal behaivour, will do a better explaination next time