Iterating over arrays in Javascript - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ Predict Output

intermediate

Output of forEach with asynchronous callback

What is the output of this code snippet?

Javascript

const arr = [1, 2, 3];
arr.forEach(async (num) => {
  await new Promise(resolve => setTimeout(resolve, 10));
  console.log(num * 2);
});
console.log('Done');

A

2
4
6

B

2
4
6
Done

C Done

D

Done
2
4
6

💡 Hint

Remember that forEach does not wait for async callbacks to finish.

The forEach loop starts all async callbacks but does not wait for them. So 'Done' is logged immediately, then after delays, 2, 4, 6 are logged.

❓ Predict Output

intermediate

Output of map with side effects

What is the output of this code?

Javascript

const numbers = [1, 2, 3];
const result = numbers.map((num, index) => {
  console.log(index);
  return num * 2;
});
console.log(result);

A

0
1
2
[2, 4, 6]

B [2, 4, 6]

C 0 1 2 [2, 4, 6]

D undefined

💡 Hint

map calls the callback for each element and returns a new array.

The map callback logs the index for each element (0,1,2) then returns doubled values. The final console.log prints the new array.

🔧 Debug

advanced

Why does this for...of loop skip the last element?

Consider this code. Why does it skip printing the last element? const arr = [10, 20, 30]; for (let i of arr) { if (i === 20) break; console.log(i); }

Javascript

const arr = [10, 20, 30];
for (let i of arr) {
  if (i === 20) break;
  console.log(i);
}

A Because the console.log is inside the if statement and skips 30.

B Because the loop only iterates twice by default.

C Because the break stops the loop when i equals 20, so 30 is never reached.

D Because the array length is incorrectly set to 2.

💡 Hint

What does the break statement do inside a loop?

The break stops the loop immediately when i equals 20, so the last element 30 is never processed or printed.

📝 Syntax

advanced

Identify the syntax error in this array iteration

Which option contains the syntax error?

A for (let i = 0; i < arr.length; i++) { console.log(arr[i]); }

B for arr in i { console.log(i); }

C for (let i of arr) console.log(i);

D for (let i in arr) { console.log(arr[i]); }

💡 Hint

Check the order of keywords in the for loop syntax.

Option B has incorrect syntax: 'for arr in i' is invalid. The correct syntax is 'for (let i of arr)'.

🚀 Application

expert

Find the sum of squares of even numbers using array iteration

Which code snippet correctly calculates the sum of squares of even numbers in the array [1,2,3,4,5,6]?

A

const arr = [1,2,3,4,5,6];
const sum = arr.filter(n => n % 2 === 0).map(n => n ** 2).reduce((a,b) => a + b, 0);
console.log(sum);

B

const arr = [1,2,3,4,5,6];
const sum = arr.map(n => n ** 2).filter(n => n % 2 === 0).reduce((a,b) => a + b, 0);
console.log(sum);

C

const arr = [1,2,3,4,5,6];
const sum = arr.reduce((a,b) => a + b ** 2, 0);
console.log(sum);

D

const arr = [1,2,3,4,5,6];
const sum = arr.reduce((a,b) => a + (b % 2 === 0 ? b ** 2 : 0), 0);
console.log(sum);

💡 Hint

Filter first to keep even numbers, then square, then sum.

Option A filters even numbers first, then squares them, then sums. Option A squares all first, then filters even squares (wrong). Option A sums squares of even numbers correctly but uses reduce only. Option A sums squares of all numbers (wrong).