Common JavaScript Interview Questions
Question: What is JavaScript, and how does it differ from Java?
Question: Explain the difference between let, const, and var.
Question: What is the significance of closures in JavaScript?
Question: How does asynchronous JavaScript work, and what is the event loop?
Question: Explain the concept of hoisting.
Question: What is the this keyword in JavaScript?
Question: How do you handle errors in JavaScript?
Question: Explain the differences between == and ===.
Question: What is a callback function?
Question: Describe the concept of prototypal inheritance.
Question: What is the purpose of the bind() method?
Question: Explain the concept of event delegation.
Question: How does the localStorage differ from sessionStorage?
Question: What is the purpose of the fetch API?
Question: Explain the concept of promises.
Question: What is the purpose of the async and await keywords?
Question: What is the difference between null and undefined?
Question: How can you clone an object in JavaScript?
Question: What is the purpose of the map() function in JavaScript?
Question: How does the setTimeout function work?
Question: Explain the concept of the same-origin policy.
Question: What is the purpose of the Object.keys() method?
Question: How do you handle cross-origin requests in JavaScript?
Question: What is the purpose of the localStorage and sessionStorage objects?
Question: Explain the difference between the nullish coalescing operator (??) and the logical OR operator (||) in JavaScript.
Common JavaScript Interview Questions
Question: What is JavaScript, and how does it differ from Java?
Answer: JavaScript is a dynamic, prototype-based scripting language used for web development. It is often embedded directly into HTML. Java, on the other hand, is a class-based, object-oriented programming language. Despite their similar names, they have different syntax, design principles, and use cases.
Question: Explain the difference between let, const, and var.
Answer: let and const were introduced in ES6 and are block-scoped, meaning they are limited to the block in which they are defined. var is function-scoped and has some quirks regarding hoisting. const is used for variables that should not be reassigned, while let is for variables that may be reassigned.
Question: What is the significance of closures in JavaScript?
Answer: Closures allow functions to maintain access to variables from their containing (enclosing) lexical scope even after the outer function has finished execution. They are crucial for data encapsulation and creating private variables in JavaScript.
Question: How does asynchronous JavaScript work, and what is the event loop?
Answer: JavaScript is single-threaded and asynchronous. Asynchronous operations are handled through callbacks and the event loop. Callbacks are registered to be executed when an asynchronous operation completes, and the event loop manages the execution order of these callbacks.
Question: Explain the concept of hoisting.
Answer: Hoisting is a JavaScript behavior where variable and function declarations are moved to the top of their containing scope during the compilation phase. This allows variables and functions to be used before they are declared in the code.
Question: What is the this keyword in JavaScript?
Answer: The this keyword refers to the current object in a method or, in the global context, it refers to the global object (window in browsers). The value of this is determined by how a function is called, not where the function is declared.
Question: How do you handle errors in JavaScript?
Answer: Errors in JavaScript are typically handled using try-catch blocks. The try block contains the code that might throw an exception, and the catch block handles the exception. Additionally, the finally block, if present, will execute regardless of whether an exception is thrown or caught.
Question: Explain the differences between == and ===.
Answer: == is the equality operator, and it performs type coercion, meaning it converts the operands to the same type before making the comparison. === is the strict equality operator, and it requires both value and type to be the same for the comparison to be true. Use === to avoid unexpected type coercion.
Question: What is a callback function?
Answer: A callback function is a function passed as an argument to another function and is executed after the completion of an asynchronous operation. Callbacks are often used to handle events, make HTTP requests, or perform other non-blocking tasks.
Question: Describe the concept of prototypal inheritance.
Answer: Prototypal inheritance is a way of creating objects in JavaScript where objects can inherit properties and methods from other objects through their prototype chain. Each object has a prototype object, and if a property or method is not found on the object itself, JavaScript looks up the prototype chain until it finds the property or method.
Question: What is the purpose of the bind() method?
Answer: The bind() method creates a new function with a specified this value and initial arguments. It allows you to permanently set the context (the value of this) for a function, even when the function is called in a different context.
Question: Explain the concept of event delegation.
Answer: Event delegation is a technique where a single event listener is added to a common ancestor element, rather than attaching event listeners to individual child elements. This can improve performance and simplify event handling, especially when dealing with dynamic content.
Question: How does the localStorage differ from sessionStorage?
Answer: Both localStorage and sessionStorage are web storage options with a key-value pair interface. The main difference is that localStorage persists even when the browser is closed and reopened, while sessionStorage is cleared when the session ends, i.e., when the browser is closed.
Question: What is the purpose of the fetch API?
Answer: The fetch API is used for making network requests. It provides a more flexible and powerful way to interact with the server compared to older methods like XMLHttpRequest. It returns a Promise that resolves to the Response to that request, whether it is successful or not.
Question: Explain the concept of promises.
Answer: Promises are objects that represent the eventual completion or failure of an asynchronous operation. They are widely used for handling asynchronous code and provide a cleaner alternative to callbacks. Promises have three states: pending, resolved (fulfilled), and rejected.
Question: What is the purpose of the async and await keywords?
Answer: The async keyword is used to declare an asynchronous function, which always returns a Promise. The await keyword is used inside an async function to pause its execution until the Promise is settled. It allows writing asynchronous code in a more synchronous style, making it easier to read and reason about.
Question: What is the difference between null and undefined?
Answer: null represents the intentional absence of any object value and must be assigned, while undefined is the default value assigned to a variable that has been declared but not assigned a value. undefined is also the default return value of functions with no explicit return statement.
Question: How can you clone an object in JavaScript?
Answer: Object cloning can be done using methods like Object.assign({}, originalObject) or the spread operator const clone = { …originalObject }. However, these methods create a shallow copy, meaning nested objects are still references. For a deep copy, a custom cloning function or libraries like lodash can be used.
Question: What is the purpose of the map() function in JavaScript?
Answer: The map() function creates a new array by applying a provided function to each element in the original array. It transforms each element and returns a new array with the results, without modifying the original array.
Question: How does the setTimeout function work?
Answer: The setTimeout function is used to schedule the execution of a function or a piece of code after a specified delay in milliseconds. It adds the specified function or code snippet to the execution queue, which is processed by the event loop after the specified delay.
Question: Explain the concept of the same-origin policy.
Answer: The same-origin policy is a security measure implemented by web browsers that restricts web pages from making requests to a different domain than the one that served the web page. This policy helps prevent malicious scripts from accessing sensitive information across different origins.
Question: What is the purpose of the Object.keys() method?
Answer: The Object.keys() method returns an array of a given object’s own enumerable property names. It provides a way to extract keys from an object, which can be useful for iterating over object properties or creating arrays of keys.
Question: How do you handle cross-origin requests in JavaScript?
Answer: Cross-origin resource sharing (CORS) is used to enable cross-origin requests. The server needs to include appropriate headers, such as Access-Control-Allow-Origin, allowing or restricting access to specified domains. On the client side, requests can be made using the XMLHttpRequest object or the modern fetch API.
Question: What is the purpose of the localStorage and sessionStorage objects?
Answer: Both localStorage and sessionStorage provide a way to store key/value pairs locally in a web browser. localStorage persists across browser sessions, while sessionStorage is cleared when the session ends, i.e., when the browser is closed.
Question: Explain the difference between the nullish coalescing operator (??) and the logical OR operator (||) in JavaScript.
Answer: The nullish coalescing operator (??) returns the right operand when the left operand is null or undefined. It does not coerce falsy values like 0 or an empty string. The logical OR operator (||) returns the right operand if the left operand is falsy, which includes values like 0, an empty string, null, or undefined. Use ?? when you specifically want to check for null or undefined.