Posts

Showing posts from May, 2025

Redux toolkit

Image
🧠 What is Redux Toolkit? Redux Toolkit is the official, recommended way to use Redux — a tool that helps you manage global state in React apps. Component State (Local State) Belongs to one specific component.  It’s used when only that component needs to know or control that data. Example: Imagine a light switch component in a room. The switch ON/OFF is tracked inside that component only — no other part of the house (app) needs to know about it. function LightSwitch() {  const [isOn, setIsOn] = useState(false);  return <button onClick={() => setIsOn(!isOn)}>{isOn ? 'ON' : 'OFF'}</button>;  } Global State This is shared state — data that multiple components need to access or update. It’s stored in a central place and can be used across the app. Example: Imagine an app with a theme toggle (dark/light mode) that affects the whole app — not just one component. If you stored this in just one component, others wouldn’t know when it changes. So, you use globa...

Function Advance

Function Declaration VS Expression   2 ways to declare function. //function Declaration function walk() { console.log('walk'); } //Another way to define function(i.e function expression) //Function Expression let run = function () { console.log('running'); };// semi colon is need here //above function don't have name. // so it is called anonymous function expression // we call anonymous function using run reference like run(); //we can decalre another variable called move abd set it like let move = run // and call move, both move and run are referencing same anonymous function move() console.log(move.name);// run //we can give it name and call it as name function expression let dog = function run1() { console.log('run'); } dog()// we can call it using it's reference only not name console.log(dog.name)// But we get name of function as run1 Key difference between function declaration and function expression is how we can call these function....

Technical Jargon in JS

Image
Technical Jargon in JS push → in stack putting value pop → in stack taking out value enqueue→REAR → putting value in queue dequeue →FRONT→ taking value from queue GEC → global execution context. It will be in js engine. After GEC is executed operation is terminated REAR → end where new element are added FRONT → front where element are taken out FIFO → First in first out → happens in queue Stack → first in last out → happens in stack Event loop→ checks the stack in Stack all queue data are not put in stack data to push in stack are managed by event loop and only required data are pushed to avoid deadlock condition. TDZ → Temporal Dead Zone used to store variable declared using let and const hoisting→ let and const variable are hoisted in TDZ Closure debugger; let a = 1  function outer(){  let b= 2  function test(){}  function inner(){  let c = 3  console.log(a, b, c,test)  }  inner()  } outer() // b is comming from closure W...

Array Advance

Image
 Adding element in end, beginning and middle of array. To add element at end of array we use push method. const cars = ['honda', 'bmw', 'lambo', 'bugati'] cars.push('toyata', 'jaguar') console.log(cars); To add element at beginning of array we use unshift method like cars.unshift('mastang', 'ferrari') console.log(cars); To add element at middle of array we use splice method. we can use splice method to both add and delete . Syntax Example cars.splice(2, 0, 'byd', 'mg') console.log(cars); From 2nd index byd and mg will added to array. Finding elements(Primitive Type) How to find elements in array? we have couple of method for that, that are indexOf(), lastIndexOf(), include() indexOf() → return earliest index of array if element exist else return -1 Example console.log(cars.indexOf('lambo')); —→6 lastIndexOf() →return last index of array if element exist else return -1 cars.push(...

Array Basic

 Array is another important build-in data structure in JS. Its syntax is const personName = ['hari', 'shyam', 'gita', 'rabin'] *starts with big bracket ‘[]’ *Each element have index and determine the position of element in array. Here index 0 is hari,1→shyam and so on. *Array in js is dynamic means we can store different types of variable in array unlike other static programming langage. Example const personName = ['hari', 'shyam', 'gita', 'rabin'] personName[4] = 2000 console.log(personName) Technically array is an object. It has bunch of build-in function if type personName. → we can see its properties or method and we can use it. like console.log(personName.length) --->5 console.log(typeof personName) --->object

JS Basic

Image
  Variable variable are fundamental concept in any other programming language. variable are used to store data temporarily in computer memory. In simple language In box we kept stuff in it. And gave it a label by same tokean variable are value we kept in memory and give it a label and use as variable. In general variables are name given to the stored data. Before ES6, we use ‘var’ keyword to declare a variable. but it have issue now we use ‘let’ to declare variable Var vs let vs const JS is Dynamic language JS is dynamic type language. Means In general we have 2 type of language in js -static In static when we declare a variable the type of variable is set and it cannot be changed in future. -dynamic in dynamic language like js , the type of variable can change at run time. Example let name = 'bishal'; console.log(typeof name) name = 21; console.log(typeof name); In js we don’t have 2 kinds of number, we don’t have floating and integer. we only have number type. example let a...