Map function in Javascript Interview Questions
🚀 Are you preparing for a JavaScript interview?
The map()
function is one of the most commonly asked topics in JavaScript coding interviews.
Understanding how map()
works, its use cases, and how it differs from other array methods can help you ace technical interviews. In this guide, we’ll cover the top map()
function interview questions along with clear explanations and examples to boost your confidence.
Â
Â
Basic Questions:
What is the
map()
function in JavaScript?
Answer: Themap()
function is an array method that creates a new array by applying a provided function to each element of the original array. It does not modify the original array but returns a new one.Example:
const numbers = [1, 2, 3, 4]; const squared = numbers.map(num => num * num); console.log(squared); // [1, 4, 9, 16]
How is
map()
different fromforEach()
?
Answer:map()
returns a new array, whereasforEach()
does not return anything (it just executes a function on each element).- Use
map()
when you need a transformed array, and useforEach()
when you only need to iterate over elements.
Example:
const numbers = [1, 2, 3]; const doubled = numbers.map(num => num * 2); // [2, 4, 6] numbers.forEach(num => console.log(num * 2)); // Just logs values, doesn't return new array
Intermediate Questions:
What are the parameters of the
map()
function?
Answer: The callback function passed tomap()
receives three arguments:- element – The current element in the array.
- index (optional) – The index of the current element.
- array (optional) – The original array being traversed.
Example:
const arr = [10, 20, 30]; const newArr = arr.map((value, index, array) => value + index); console.log(newArr); // [10, 21, 32]
Can we modify the original array using
map()
?
Answer: No,map()
does not modify the original array. However, if the elements are objects, and you mutate them insidemap()
, the changes will reflect in the original array due to object reference behavior.Example:
let users = [{ name: "Alice" }, { name: "Bob" }]; users.map(user => user.name = "Unknown"); console.log(users); // [{ name: "Unknown" }, { name: "Unknown" }]
Advanced Questions:
How can you use
map()
to convert an array of strings to uppercase?
Answer:const words = ["hello", "world"]; const upperCaseWords = words.map(word => word.toUpperCase()); console.log(upperCaseWords); // ["HELLO", "WORLD"]
How do you use
map()
with an array of objects?
Answer:const users = [ { name: "Alice", age: 25 }, { name: "Bob", age: 30 } ]; const userNames = users.map(user => user.name); console.log(userNames); // ["Alice", "Bob"]
How can
map()
be used to return a specific property from an array of objects?
Answer:const cars = [ { brand: "Toyota", model: "Camry" }, { brand: "Honda", model: "Civic" } ]; const brands = cars.map(car => car.brand); console.log(brands); // ["Toyota", "Honda"]
Can we chain
map()
with other array methods likefilter()
orreduce()
?
Answer: Yes,map()
can be chained withfilter()
andreduce()
.Example: Return only even numbers squared:
const numbers = [1, 2, 3, 4, 5]; const evenSquares = numbers.filter(num => num % 2 === 0).map(num => num * num); console.log(evenSquares); // [4, 16]
What happens if
map()
is used on an empty array?
Answer: It returns an empty array because there are no elements to iterate over.const emptyArr = []; const result = emptyArr.map(num => num * 2); console.log(result); // []
Can
map()
be used on non-array objects?
Answer: No,map()
is specifically an array method and does not work directly on objects. However, you can useObject.keys()
,Object.values()
, orObject.entries()
to map over object properties.Example:
const person = { name: "Alice", age: 25 }; const keys = Object.keys(person).map(key => key.toUpperCase()); console.log(keys); // ["NAME", "AGE"]
Bonus Question:
How would you implement your own version of map()
?
Answer:
You can create a custom map()
function using a loop.
Array.prototype.myMap = function(callback) {
let result = [];
for (let i = 0; i < this.length; i++) {
result.push(callback(this[i], i, this));
}
return result;
};
const numbers = [1, 2, 3];
const doubled = numbers.myMap(num => num * 2);
console.log(doubled); // [2, 4, 6]
Â
✅ The map()
function is a powerful tool in JavaScript that helps transform arrays efficiently. By mastering its syntax, use cases, and best practices, you can confidently tackle JavaScript interview questions.
Keep practicing, experiment with chaining methods, and explore real-world use cases to strengthen your understanding.
Do you have any other JavaScript interview questions? Drop them in the comments, and let’s discuss!