Top 20 Javascript Interview Questions and Answers
Here are 20 essential JavaScript interview questions and their answers:
We have already knew the Top 15 CSS Interview Questions and their answers.
1. What is JavaScript?
Answer:
JavaScript is a high-level, interpreted scripting language primarily used for adding interactivity to web pages. It is lightweight, dynamic, and supports object-oriented, imperative, and functional programming styles.
2. What are the data types supported in JavaScript?
Answer:
JavaScript supports:
- Primitive types:
String
,Number
,Boolean
,Null
,Undefined
,Symbol
,BigInt
- Non-primitive type:
Object
3. What is let
, var
, and const
?
Answer:
var
: Function-scoped or globally scoped, can be re-declared and updated.let
: Block-scoped, cannot be re-declared in the same block but can be updated.const
: Block-scoped, cannot be re-declared or updated (for primitive values).
4. What is the difference between ==
and ===
?
Answer:
==
: Loose equality, compares values after type coercion.===
: Strict equality, compares both value and type without type coercion.
5. What are closures in JavaScript?
Answer:
A closure is a function that retains access to its outer scope, even after the outer function has returned. Closures allow functions to store variables and maintain state across different calls.
6. Explain null
vs undefined
.
Answer:
null
: An intentional absence of any object value, set explicitly by the programmer.undefined
: Indicates that a variable has been declared but has not yet been assigned a value.
7. What is the this
keyword?
Answer:this
refers to the current object the function is being executed on. It depends on how the function is called:
- In a method:
this
refers to the object. - In a global function:
this
refers to the global object. - In strict mode:
this
isundefined
.
8. What are arrow functions?
Answer:
Arrow functions are a concise syntax for writing functions in JavaScript. They do not have their own this
context and cannot be used as constructors.
jsCopy codeconst add = (a, b) => a + b;
9. What is event delegation?
Answer:
Event delegation is a technique where a single event handler is attached to a parent element, and due to event bubbling, it handles events for its child elements. This improves performance by minimizing the number of event handlers.
10. What is a callback function?
Answer:
A callback is a function passed as an argument to another function. It is executed after the completion of that function.
jsCopy codefunction fetchData(callback) {
setTimeout(() => {
callback('Data fetched');
}, 1000);
}
11. Explain hoisting in JavaScript.
Answer:
Hoisting is JavaScript’s default behavior of moving variable and function declarations to the top of their scope before execution. Only declarations are hoisted, not initializations.
12. What is the difference between map()
, forEach()
, and filter()
?
Answer:
map()
: Creates a new array by applying a function to each element of an existing array.forEach()
: Executes a function on each array element but does not return a new array.filter()
: Creates a new array with elements that pass a test implemented by a provided function.
13. What are promises and how do you use them?
Answer:
Promises represent asynchronous operations in JavaScript. A promise can be in one of three states: pending
, fulfilled
, or rejected
.
jsCopy codeconst promise = new Promise((resolve, reject) => {
// async operation
resolve('Success');
});
promise.then((result) => console.log(result));
14. What is async/await in JavaScript?
Answer:async/await
is a syntactic sugar over promises that allows writing asynchronous code in a synchronous manner.
jsCopy codeasync function fetchData() {
const data = await fetch('api/data');
console.log(data);
}
15. What is a prototype in JavaScript?
Answer:
A prototype is an object from which other objects inherit properties. Every JavaScript object has a prototype, and the prototype object itself can have a prototype, forming a chain known as the prototype chain.
16. What is a higher-order function?
Answer:
A higher-order function is a function that takes another function as an argument, returns a function, or both. Examples include map()
, filter()
, and reduce()
.
17. What is the difference between function declaration and function expression?
Answer:
- Function declaration: Named functions that are hoisted.jsCopy code
function myFunc() { return 'Hello'; }
- Function expression: Functions assigned to a variable, not hoisted.jsCopy code
const myFunc = function() { return 'Hello'; }
18. What is destructuring in JavaScript?
Answer:
Destructuring allows unpacking values from arrays or properties from objects into distinct variables.
jsCopy codeconst [a, b] = [1, 2];
const { name, age } = { name: 'Alice', age: 25 };
19. What are modules in JavaScript?
Answer:
Modules are files that contain reusable code. In modern JavaScript, import
and export
keywords are used to load and export modules.
jsCopy code// module.js
export const greet = () => 'Hello';
// main.js
import { greet } from './module.js';
20. What is the event loop in JavaScript?
Answer:
The event loop is a mechanism in JavaScript that allows for non-blocking execution, despite being single-threaded. It manages the execution of callbacks from the event queue after completing the current stack execution.
These are some of the most commonly asked JavaScript questions. Knowing these concepts will help you prepare effectively for technical interviews.