JavaScript Interview Preparation

JavaScript Interview Questions and Answers | Set 1

1. What are JavaScript data types?
   JavaScript has two categories of data types: primitive and non-primitive. Primitive types include String, Number, Boolean, Null, Undefined, Symbol, and BigInt. Non-primitive types consist of Object, including arrays, functions, and dates, which are stored as references.
2. Explain the difference between var, let, and const.
   var is function-scoped and can be redeclared and updated, while let is block-scoped and can be updated but not redeclared. const is also block-scoped but cannot be updated or redeclared. let and const are generally preferred for modern JavaScript.
3. What is hoisting in JavaScript?
   Hoisting refers to JavaScript’s behavior of moving variable and function declarations to the top of their respective scopes during the compile phase. While variables declared with var are hoisted, let and const are hoisted but remain uninitialized.
4. What are arrow functions?
   Arrow functions offer a concise syntax for defining functions and automatically bind the this keyword. They are shorter and more readable than traditional function expressions. Unlike regular functions, arrow functions do not have their own this and inherit it from their surrounding scope.
5. What is the difference between == and ===?
   The == operator compares values with type conversion, meaning it coerces the operands into the same type. The === operator compares both values and types without type conversion, ensuring stricter equality.
6. What is a callback function?
   A callback function is passed as an argument to another function and is executed after the completion of that function. It’s commonly used in asynchronous programming, such as when handling events or making network requests.
7. What is the purpose of the typeof operator?
   The typeof operator returns a string that indicates the type of the operand. It’s used to check the data type of variables, constants, or expressions in JavaScript, helping to ensure correct operations.
8. What is event delegation?
   Event delegation is a technique where events are handled by a parent element rather than individual child elements. This enhances performance by reducing the number of event listeners and allows for dynamic handling of newly added child elements.
9. Explain the this keyword in JavaScript.
   The this keyword refers to the context in which a function is called. Its value depends on how the function is invoked, and it can refer to the global object, an object, or an instance method, depending on the situation.
10. What is NaN in JavaScript?
    NaN stands for “Not-a-Number” and represents an invalid or unrepresentable numerical value, such as the result of an undefined mathematical operation. It is of type Number and is not equal to any other value, including itself.

JavaScript Interview Questions and Answers | Set 2

1. What are JavaScript closures?
   A closure is a function that retains access to its lexical scope, even after the function that created it has finished executing. Closures enable powerful features like private variables and function factories.
2. What is the difference between null and undefined?
   null represents a deliberate absence of a value, typically used to indicate the intentional lack of an object. undefined, on the other hand, indicates a variable has been declared but not yet assigned a value.
3. What is a JavaScript promise?
   A JavaScript promise is an object representing the eventual completion or failure of an asynchronous operation. Promises can be in one of three states: pending, resolved, or rejected. They allow for more manageable asynchronous code.
4. What is the event loop in JavaScript?
   The event loop is a programming construct that enables JavaScript to handle asynchronous operations. It continuously checks the call stack and the message queue, executing tasks when the stack is clear, enabling non-blocking behavior.
5. What are higher-order functions?
   Higher-order functions are functions that either take one or more functions as arguments or return a function as a result. They are used extensively in functional programming for tasks like composition and currying.
6. What is the difference between slice() and splice()?
   slice() returns a shallow copy of a portion of an array without modifying the original array, while splice() modifies the array by removing, replacing, or adding elements in place.
7. What are template literals?
   Template literals allow for multi-line strings and string interpolation. Using backticks, they let you embed expressions inside a string with ${expression} syntax, which makes working with strings more flexible and readable.
8. What is the difference between synchronous and asynchronous JavaScript?
   Synchronous code is executed sequentially, blocking the next operation until the current one completes. Asynchronous code, on the other hand, allows the program to continue executing while waiting for tasks like I/O or network requests to complete.
9. What are ES6 modules?
   ES6 modules enable the splitting of code into smaller, reusable pieces, which can be imported and exported between different files. This helps maintain cleaner and more modular code in large applications.
10. Explain try-catch in JavaScript.
    try-catch is used to handle exceptions in JavaScript. The try block contains code that may throw an error, while the catch block handles the error, preventing the program from crashing and allowing for graceful error handling.

JavaScript Interview Questions and Answers | Set 3

1. What is prototypal inheritance?
   Prototypal inheritance allows objects to inherit properties and methods from other objects. JavaScript uses a prototype chain, where objects delegate behavior to their prototype, which can be modified at runtime.
2. Explain bind(), call(), and apply().
   • bind(): Returns a new function with a fixed this value.
   • call(): Immediately invokes the function with a specified this value and arguments passed individually.
   • apply(): Similar to call(), but arguments are passed as an array.
3. What is the difference between deep and shallow copying?
   Shallow copying creates a copy of an object’s first level of properties, but nested objects are shared between the original and the copy. Deep copying duplicates all levels of properties, creating an entirely independent object.
4. What is the difference between forEach() and map()?
   • forEach() executes a provided function once for each array element, but does not return anything.
   • map() executes the function for each element and returns a new array with the transformed elements.
5. What are JavaScript decorators?
   JavaScript decorators are functions used to modify the behavior of classes, methods, or properties. They are commonly used in frameworks and libraries to implement patterns like logging or access control.
6. What are Web APIs in JavaScript?
   Web APIs provide interfaces for interacting with browser features, such as DOM manipulation, AJAX requests (using fetch), and timers (setTimeout/setInterval). They allow JavaScript to interact with the web environment.
7. What is the difference between let, var, and global scope?
   var is function-scoped, meaning it’s accessible only within the function where it’s declared. let is block-scoped, and the global object is available throughout the entire execution context, unless restricted by let or const.
8. What is memoization?
   Memoization is an optimization technique used to cache the results of expensive function calls, ensuring that subsequent calls with the same parameters return the cached result instead of recalculating it.
9. What is an IIFE (Immediately Invoked Function Expression)?
   An IIFE is a function that is defined and immediately invoked. It’s often used to create a local scope and avoid polluting the global namespace.
   Example:javascriptCopy code(function () { console.log("Hello!"); })();
10. Explain event bubbling and capturing.
    Event bubbling and capturing refer to the phases in which an event is propagated through the DOM. In bubbling, events propagate from the target element to the root, while in capturing, the event propagates from the root to the target element. Event bubbling is the default behavior.