When you add an event listener in JavaScript using the addEventListener method, you can specify various options to control how that event listener behaves. One of these options is once: true. This option tells the browser to automatically remove the event listener after it has been triggered once. In simple terms, once: true ensures that…
In any workplace, one of the most debated topics is how to judge performance fairly. Is it purely about what someone delivers, or does how they present themselves and engage with the team hold equal weight? This becomes especially important during performance reviews when a balance between results and visibility can sometimes tip unfairly. Let’s…
What is IIFE? An Immediately Invoked Function Expression (IIFE) is a JavaScript design pattern where a function is defined and executed immediately after it’s declared. It’s typically wrapped within parentheses to denote a function expression and followed by an additional pair of parentheses to invoke it immediately. Function Expression In JavaScript, we treat functions as…
Synchronous & Asynchronous Code Synchronous code – Synchronous code is executed line by line in the order it appears in the program. Each statement waits for the previous one to complete before executing. This means that if there’s a time-consuming task or an I/O operation, the whole program or function will be blocked until that…
var even though console.log(x) appears before the declaration var x = 5 it doesn’t result in an error. During the compilation phase, the declaration var x is hoisted to the top, making the variable x accessible throughout its scope. However, only the declaration is hoisted, not the initialization, so the first console.log(x) outputs undefined. The…
What is Hoisting? In JavaScript, hoisting is a behaviour where variable and function declarations are lifted to the top of their respective scopes during the compilation phase. This ensures that, no matter where you declare variables and functions in your code, they are effectively moved to the top of their scopes before the actual code…
When building web applications with React, managing side effects is a common challenge. Side effects are operations that occur outside the regular flow of a component, such as data fetching, DOM manipulation, and event subscriptions. React provides a solution for this: the useEffect hook. Understanding useEffect useEffect is a hook in React that allows you…
React is renowned for its efficiency and performance optimizations. Two critical tools for achieving this are useMemo and useCallback, which play a pivotal role in optimizing React components by memoizing values and functions. Let’s take a closer look to understand what makes useMemo and useCallback necessary, why we use them, how they do their jobs,…
React, a popular JavaScript library for building user interfaces, relies heavily on two essential concepts: Props and State. These concepts are fundamental to understanding how data flows within React components and how components interact with one another. In this guide, we’ll delve into what Props and States are, their differences, and how to use them…