Modifying arrays in Javascript - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ Predict Output

intermediate

What is the output of this code modifying an array with splice?

Consider the following JavaScript code that modifies an array using splice. What will be logged to the console?

Javascript

const arr = [10, 20, 30, 40, 50];
arr.splice(2, 2, 25, 35);
console.log(arr);

A [10, 20, 30, 40, 50]

B [25, 35, 50]

C [10, 20, 25, 35, 40, 50]

D [10, 20, 25, 35, 50]

💡 Hint

Remember that splice(start, deleteCount, items...) removes deleteCount items starting at start, then inserts items.

The splice call removes 2 elements starting at index 2 (30 and 40), then inserts 25 and 35 at that position. The resulting array is [10, 20, 25, 35, 50].

❓ Predict Output

intermediate

What is the output after using push and pop on an array?

Look at this code that modifies an array with push and pop. What will be the final output?

Javascript

const fruits = ['apple', 'banana'];
fruits.push('cherry');
const popped = fruits.pop();
console.log(fruits, popped);

A ['apple', 'banana'] 'cherry'

B ['apple', 'banana', 'cherry'] 'banana'

C ['apple', 'banana'] 'banana'

D ['apple', 'banana', 'cherry'] 'cherry'

💡 Hint

push adds an item to the end, pop removes the last item and returns it.

After pushing 'cherry', the array is ['apple', 'banana', 'cherry']. Then pop removes 'cherry' and returns it. The array is back to ['apple', 'banana'].

🔧 Debug

advanced

Why does this code throw an error when modifying an array?

This code tries to modify an array but throws an error. What is the cause?

Javascript

const arr = Object.freeze([1, 2, 3]);
arr[0] = 10;
console.log(arr);

A SyntaxError: Unexpected token '='

B TypeError: Cannot assign to read only property '0' of object '[object Array]'

C ReferenceError: arr is not defined

D [10, 2, 3]

💡 Hint

Object.freeze makes an object immutable.

The array is frozen, so trying to assign a new value to an element causes a TypeError.

❓ Predict Output

advanced

What is the output after using map and modifying the original array?

What will be logged after running this code that modifies an array inside a map callback?

Javascript

const nums = [1, 2, 3];
const result = nums.map((num, i, arr) => {
  arr[i] = num * 2;
  return num + 1;
});
console.log(result, nums);

A [2, 3, 4] [2, 4, 6]

B [2, 3, 4] [1, 2, 3]

C [1, 2, 3] [2, 4, 6]

D [1, 2, 3] [1, 2, 3]

💡 Hint

The map callback modifies the original array while returning a new array.

The map returns each original number plus 1, so result is [2,3,4]. Meanwhile, the original array elements are doubled inside the callback, so nums becomes [2,4,6].

🧠 Conceptual

expert

Which option correctly removes all occurrences of a value from an array?

You want to remove all occurrences of the number 3 from an array. Which code snippet correctly does this without mutating the original array?

A arr = arr.map(x => x === 3 ? null : x);

B arr.splice(arr.indexOf(3), 1);

C const filtered = arr.filter(x => x !== 3);

D arr.pop(3);

💡 Hint

Filter creates a new array with only elements that pass the test.

Option C returns a new array excluding all 3s without changing the original. Option C mutates the array and removes only the first 3. Option C replaces 3s with null but keeps them. Option C is invalid because pop does not take arguments.