Interview Questions 💡

Prepare for your interviews with commonly asked questions in tech and development roles 🚀

Questions & Answers 📚

What is React and why is it used?
React is a JavaScript library for building user interfaces. It allows developers to create reusable UI components.
Explain the difference between state and props in React.
State is internal to a component and can change over time, while props are read-only data passed from parent to child components.
What is a closure in JavaScript?
A closure is a function that has access to variables from its outer function scope even after the outer function has executed.
What is the difference between let, const, and var?
var is function-scoped, let and const are block-scoped. const cannot be reassigned while let can.
What is the use of useEffect in React?
useEffect allows you to perform side effects in functional components, like fetching data or subscribing to events.
Explain virtual DOM in React.
The virtual DOM is a lightweight copy of the real DOM that React uses to optimize updates and improve performance.
What are React hooks?
Hooks are functions like useState, useEffect, useRef that let you use state and lifecycle features in functional components.
What is the difference between synchronous and asynchronous JavaScript?
Synchronous code runs sequentially, while asynchronous code runs in the background and completes later using callbacks, promises, or async/await.
Explain event delegation in JavaScript.
Event delegation is a technique where a parent element handles events for its child elements, improving performance and memory usage.
What is the difference between == and === in JavaScript?
== compares values after type coercion, === compares both value and type strictly.
What are promises in JavaScript?
Promises represent a value that may be available now, later, or never, and are used for asynchronous operations.
Explain the difference between null and undefined.
null is an assigned value representing no value, undefined means a variable has been declared but not assigned.
What is the purpose of keys in React lists?
Keys help React identify which items have changed, are added, or removed, improving performance in list rendering.
What is a pure component in React?
A pure component renders the same output for the same state and props, preventing unnecessary re-renders.
What is the difference between class and functional components?
Class components use ES6 classes and have lifecycle methods, functional components use functions and hooks.
What is a higher-order component (HOC)?
HOC is a function that takes a component and returns a new component with added functionality.
Explain context API in React.
Context API provides a way to pass data through the component tree without passing props manually at every level.
What is the difference between controlled and uncontrolled components?
Controlled components have state managed by React, uncontrolled components store their own state internally.
Explain debouncing in JavaScript.
Debouncing ensures that a function is called only once after a specified delay, preventing multiple rapid calls.
What is REST API?
REST API is an architectural style for designing networked applications using HTTP requests to access resources.
What is the difference between localStorage and sessionStorage?
localStorage stores data permanently, sessionStorage stores data for the duration of the page session.
What is the difference between async and defer in script tags?
async loads the script asynchronously without blocking HTML parsing, defer waits until HTML is parsed before executing.
What is JSON?
JSON (JavaScript Object Notation) is a lightweight format for storing and exchanging data.
Explain event bubbling in JavaScript.
Event bubbling is when an event propagates from the target element up through its parent elements.
What is the difference between call, apply, and bind?
call invokes a function with a given this and arguments, apply uses an array of arguments, bind returns a new function with bound this.
Explain CORS.
CORS (Cross-Origin Resource Sharing) is a mechanism to allow or restrict requested resources on a web server from another domain.
What is hoisting in JavaScript?
Hoisting is JavaScript's behavior of moving variable and function declarations to the top of their scope before execution.
What is the difference between == and === in JS?
== performs type coercion before comparison, === checks both type and value strictly.
What are service workers?
Service workers are scripts that run in the background and enable offline experiences, push notifications, and caching.
What is the difference between SPA and MPA?
SPA (Single Page Application) loads a single HTML page and dynamically updates content, MPA (Multi Page Application) loads new HTML pages from the server.
What is the use of useRef hook?
useRef stores a mutable value that persists across renders and can access DOM elements directly.
Explain the difference between shallow copy and deep copy.
Shallow copy copies only the top-level properties, deep copy duplicates nested objects as well.
What is the difference between flex and grid in CSS?
Flex is 1D layout (row or column), Grid is 2D layout (row and column simultaneously).
What is the difference between CSS relative and absolute positioning?
Relative positions element relative to its normal position, absolute positions element relative to nearest positioned ancestor.
What are pseudo-classes in CSS?
Pseudo-classes define a special state of an element, like :hover, :focus, or :nth-child().
What is the difference between inline, block, and inline-block elements?
Inline elements do not break line, block elements take full width, inline-block behaves like inline but respects width/height.
Explain hoisting in JS functions vs variables.
Function declarations are hoisted completely, variable declarations are hoisted but not initializations.
What is event loop in JavaScript?
Event loop allows asynchronous code to execute after synchronous code, managing the call stack and callback queue.
What is the difference between synchronous and asynchronous code?
Synchronous code executes in order, asynchronous code runs independently and may complete later.
Explain promises chaining in JS.
Chaining allows multiple then() calls where each then() receives the result of the previous promise.
What is the difference between null, undefined, and NaN?
null is explicitly no value, undefined is uninitialized, NaN is Not a Number result.
What is the difference between React Fragment and div?
Fragment groups elements without adding extra nodes to the DOM; div adds a real element.
Explain prop drilling in React.
Prop drilling is passing data from parent to child components through multiple levels of props.
What is memoization in React?
Memoization optimizes performance by caching computed values to prevent unnecessary re-renders.
Explain controlled components in React forms.
Controlled components have form input values managed by React state.
What is lazy loading in React?
Lazy loading loads components or assets only when they are required, reducing initial load time.
What are higher-order functions in JS?
Functions that take other functions as arguments or return functions.
Explain context API vs Redux.
Context API is for passing state globally, Redux provides a full state management solution with actions and reducers.
What is the difference between setTimeout and setInterval?
setTimeout executes a function once after a delay, setInterval repeatedly executes a function at intervals.
What is event delegation and why is it useful?
Event delegation allows attaching a single event listener on a parent element to manage all child events, improving performance.
Explain the difference between relative, absolute, and fixed positioning.
Relative positions element relative to normal position, absolute relative to parent, fixed relative to viewport.
What are the different ways to style React components?
CSS files, CSS modules, inline styles, styled-components, Tailwind CSS, or emotion library.
What is the difference between SPA and server-side rendering?
SPA dynamically updates content in browser, SSR renders pages on the server before sending to client.
What is useMemo in React?
useMemo memoizes expensive computations so they are recalculated only when dependencies change.
Explain the difference between var, let, and const.
var is function scoped, let and const are block scoped; const cannot be reassigned.
What is React and why is it used?
React is a JavaScript library for building user interfaces. It allows developers to create reusable UI components.
Explain the difference between state and props in React.
State is internal to a component and can change over time, while props are read-only data passed from parent to child components.
What is a closure in JavaScript?
A closure is a function that has access to variables from its outer function scope even after the outer function has executed.
What is the difference between let, const, and var?
var is function-scoped, let and const are block-scoped. const cannot be reassigned while let can.
What is the use of useEffect in React?
useEffect allows you to perform side effects in functional components, like fetching data or subscribing to events.
Explain virtual DOM in React.
The virtual DOM is a lightweight copy of the real DOM that React uses to optimize updates and improve performance.
What are React hooks?
Hooks are functions like useState, useEffect, useRef that let you use state and lifecycle features in functional components.
What is the difference between synchronous and asynchronous JavaScript?
Synchronous code runs sequentially, while asynchronous code runs in the background and completes later using callbacks, promises, or async/await.
Explain event delegation in JavaScript.
Event delegation is a technique where a parent element handles events for its child elements, improving performance and memory usage.
What is the difference between == and === in JavaScript?
== compares values after type coercion, === compares both value and type strictly.
What are promises in JavaScript?
Promises represent a value that may be available now, later, or never, and are used for asynchronous operations.
Explain the difference between null and undefined.
null is an assigned value representing no value, undefined means a variable has been declared but not assigned.
What is the purpose of keys in React lists?
Keys help React identify which items have changed, are added, or removed, improving performance in list rendering.
What is a pure component in React?
A pure component renders the same output for the same state and props, preventing unnecessary re-renders.
What is the difference between class and functional components?
Class components use ES6 classes and have lifecycle methods, functional components use functions and hooks.
What is a higher-order component (HOC)?
HOC is a function that takes a component and returns a new component with added functionality.
Explain context API in React.
Context API provides a way to pass data through the component tree without passing props manually at every level.
What is the difference between controlled and uncontrolled components?
Controlled components have state managed by React, uncontrolled components store their own state internally.
Explain debouncing in JavaScript.
Debouncing ensures that a function is called only once after a specified delay, preventing multiple rapid calls.
What is REST API?
REST API is an architectural style for designing networked applications using HTTP requests to access resources.