Listen to this Post
JavaScript is the backbone of web development! If you’re preparing for an interview, here are some must-know questions:
1️⃣ What is the difference between var, let, and const?
2️⃣ Explain closures in JavaScript with an example.
3️⃣ What is event delegation, and why is it useful?
4️⃣ How does JavaScript handle asynchronous operations?
5️⃣ What is the difference between == and ===?
6️⃣ Explain the concept of hoisting in JavaScript.
7️⃣ What are promises, and how do they differ from async/await?
8️⃣ What is the difference between call(), apply(), and bind()?
9️⃣ How does prototypal inheritance work in JavaScript?
🔟 What are the different ways to deep clone an object in JavaScript?
You Should Know:
1. Difference Between var, let, and const
- var: Function-scoped, can be redeclared and updated.
- let: Block-scoped, can be updated but not redeclared.
- const: Block-scoped, cannot be updated or redeclared.
Example:
[javascript]
var x = 10;
let y = 20;
const z = 30;
[/javascript]
2. Closures in JavaScript
A closure is a function that retains access to its lexical scope even when executed outside that scope.
Example:
[javascript]
function outer() {
let count = 0;
return function inner() {
count++;
return count;
};
}
const counter = outer();
console.log(counter()); // 1
console.log(counter()); // 2
[/javascript]
3. Event Delegation
Event delegation allows you to add a single event listener to a parent element to handle events for all its child elements.
Example:
[javascript]
document.getElementById(‘parent’).addEventListener(‘click’, function(event) {
if (event.target.tagName === ‘LI’) {
console.log(‘List item clicked:’, event.target.textContent);
}
});
[/javascript]
4. Asynchronous Operations
JavaScript handles asynchronous operations using callbacks, promises, and async/await.
Example with Promises:
[javascript]
const fetchData = () => {
return new Promise((resolve, reject) => {
setTimeout(() => resolve(“Data fetched”), 2000);
});
};
fetchData().then(data => console.log(data));
[/javascript]
Example with Async/Await:
[javascript]
async function getData() {
const data = await fetchData();
console.log(data);
}
getData();
[/javascript]
5. Difference Between == and ===
- ==: Compares values after type coercion.
- ===: Compares values without type coercion (strict equality).
Example:
[javascript]
console.log(1 == ‘1’); // true
console.log(1 === ‘1’); // false
[/javascript]
6. Hoisting in JavaScript
Hoisting is JavaScript’s default behavior of moving declarations to the top of the current scope.
Example:
[javascript]
console.log(x); // undefined
var x = 5;
[/javascript]
7. Promises vs Async/Await
- Promises: Use `.then()` and `.catch()` for handling asynchronous operations.
- Async/Await: Syntactic sugar over promises, making asynchronous code look synchronous.
Example:
[javascript]
// Promises
fetchData().then(data => console.log(data)).catch(err => console.error(err));
// Async/Await
async function fetchDataAsync() {
try {
const data = await fetchData();
console.log(data);
} catch (err) {
console.error(err);
}
}
[/javascript]
8. call(), apply(), and bind()
- call(): Invokes a function with a given `this` value and arguments provided individually.
- apply(): Similar to
call(), but arguments are provided as an array. - bind(): Returns a new function with a bound `this` value.
Example:
[javascript]
const obj = { value: 42 };
function logValue() {
console.log(this.value);
}
logValue.call(obj); // 42
logValue.apply(obj); // 42
const boundFn = logValue.bind(obj);
boundFn(); // 42
[/javascript]
9. Prototypal Inheritance
JavaScript uses prototypal inheritance where objects can inherit properties and methods from other objects.
Example:
[javascript]
function Person(name) {
this.name = name;
}
Person.prototype.greet = function() {
console.log(Hello, ${this.name});
};
const person = new Person(‘John’);
person.greet(); // Hello, John
[/javascript]
10. Deep Cloning an Object
Deep cloning creates a new object with all nested objects copied, not just references.
Example:
[javascript]
const obj = { a: 1, b: { c: 2 } };
const deepClone = JSON.parse(JSON.stringify(obj));
console.log(deepClone); // { a: 1, b: { c: 2 } }
[/javascript]
What Undercode Say:
Mastering JavaScript is essential for web development. Practice these concepts thoroughly to ace your interviews. Use tools like Node.js for backend development and React.js for frontend to build robust applications. Explore more resources like MDN Web Docs for in-depth learning. Keep coding and experimenting! 🚀
References:
Reported By: Sumit Yadav – Hackers Feeds
Extra Hub: Undercode MoN
Basic Verification: Pass ✅
