JavaScript is one of the most in-demand programming languages for web development, from dynamic websites to advanced web applications. Whether you are preparing for your first interview or planning to enhance your skills, having a solid understanding of JavaScript fundamentals is very important. In this article, we’ve compiled 25 JavaScript interview questions and answers for beginners as well as intermediate-level. So let’s start.
1. What is JavaScript?
Answer:
JavaScript is a lightweight, interpreted programming language primarily used to make web pages interactive. It runs on the client-side in browsers and is also used on the server-side with Node.js.
2. Difference between var, let, and const?
var x = 10; // function-scoped, can be redeclared
let y = 20; // block-scoped, cannot be redeclared in same scope
const z = 30; // block-scoped, cannot be reassignedKey points:
var: function-scoped, hoisted, allows redeclaration.let: block-scoped, no redeclaration in same scope.const: block-scoped, must be assigned at declaration, cannot be reassigned.
3. What is Hoisting in JavaScript?
Answer:
Hoisting is JavaScript’s behavior of moving variable and function declarations to the top of their scope before execution.
console.log(a); // undefined
var a = 5;
4. Explain difference between == and ===.
console.log(5 == '5'); // true (type coercion)
console.log(5 === '5'); // false (no type coercion)== compares values after type conversion.
=== compares value and type.
5. What are Template Literals in JavaScript?
let name = 'John';
console.log(`Hello, ${name}!`);- Introduced in ES6.
- Allow embedded expressions with backticks (
`).
6. What are Arrow Functions?
const add = (a, b) => a + b;
console.log(add(2, 3)); // 5- Shorter syntax for functions.
- Do not bind their own
this.
7. Explain this keyword in JavaScript.
let obj = {
name: 'Alice',
greet: function() {
console.log(this.name);
}
};
obj.greet(); // Alice- Refers to the object calling the function.
8. What is a JavaScript Closure?
Answer:
A closure is when a function remembers variables from its outer scope even after that scope has closed.
function outer() {
let count = 0;
return function() {
count++;
console.log(count);
}
}
let counter = outer();
counter(); // 1
counter(); // 2
9. Difference between null and undefined?
undefined: Variable declared but not assigned.null: Explicitly set to represent “no value”.
let a;
let b = null;
console.log(a, b); // undefined null
10. What is the difference between map() and forEach()?
let arr = [1, 2, 3];
let doubled = arr.map(x => x * 2); // returns new array
arr.forEach(x => console.log(x)); // no return11. How do you create an object in JavaScript?
let obj = { name: 'John', age: 25 };
let obj2 = new Object();
obj2.name = 'Alice';12. Explain Spread Operator (...).
let arr1 = [1, 2];
let arr2 = [...arr1, 3, 4];
console.log(arr2); // [1, 2, 3, 4]- Expands iterable elements.
13. What is Destructuring Assignment?
let [a, b] = [1, 2];
let {name, age} = {name: 'John', age: 25};14. How do you handle asynchronous code in JavaScript?
- Callbacks
- Promises
- async/await
async function fetchData() {
let res = await fetch('https://jsonplaceholder.typicode.com/posts/1');
let data = await res.json();
console.log(data);
}
fetchData();
15. What is Event Bubbling and Capturing?
Answer:
- Bubbling: Event propagates from target → parent → up to root.
- Capturing: Event goes from root → parent → target.
element.addEventListener('click', handler, true); // capturing
element.addEventListener('click', handler, false); // bubbling
16. What is the difference between slice() and splice()?
let arr = [1, 2, 3, 4];
arr.slice(1, 3); // [2, 3] (no change to original)
arr.splice(1, 2); // removes elements, modifies array17. How does JSON.stringify() and JSON.parse() work?
let obj = { name: 'John' };
let str = JSON.stringify(obj); // '{"name":"John"}'
let newObj = JSON.parse(str);18. Explain the difference between localStorage, sessionStorage, and cookies.
- localStorage: No expiry, stays until cleared.
- sessionStorage: Expires when tab is closed.
- cookies: Can have expiry dates, sent with HTTP requests.
19. What are JavaScript Promises?
let promise = new Promise((resolve, reject) => {
setTimeout(() => resolve('Done!'), 1000);
});
promise.then(console.log);
- Used for asynchronous operations.
20. How to deep copy an object in JavaScript?
let obj = { a: 1, b: { c: 2 } };
let copy = JSON.parse(JSON.stringify(obj));21. What is a Higher-Order Function?
Answer:
A function that takes another function as an argument or returns a function.
function higherOrder(fn) {
return fn();
}
22. Difference between call(), apply(), and bind()?
let obj = { name: 'John' };
function greet(greeting) {
console.log(`${greeting}, ${this.name}`);
}
greet.call(obj, 'Hello'); // Hello, John
greet.apply(obj, ['Hi']); // Hi, John
let bound = greet.bind(obj);
bound('Hey'); // Hey, John23. What is the difference between synchronous and asynchronous code?
- Synchronous: Runs line by line, blocking.
- Asynchronous: Non-blocking, uses callbacks/promises.
24. Explain the typeof operator.
typeof 'Hello'; // "string"
typeof 42; // "number"
typeof null; // "object" (quirk)25. How to debounce a function in JavaScript?
function debounce(fn, delay) {
let timer;
return function(...args) {
clearTimeout(timer);
timer = setTimeout(() => fn.apply(this, args), delay);
};
}
window.addEventListener('resize', debounce(() => {
console.log('Resized!');
}, 500));
- Debouncing ensures a function runs only after a certain pause in events.
Takeaway
Mastering JavaScript is very crucial for Web frontend developers who are keen to work in React and Angular. These 25 JavaScript interview questions with code examples will help you strengthen your fundamentals of JavaScript. Continue practising, try with the code, and stay up-to-date with the latest ES6+ features to stay ahead in the interview.
Keep Following – SharePointCafe.NET
