Array Insertion at Beginning in DSA Javascript - Interactive Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to insert the value 5 at the beginning of the array.

DSA Javascript

let arr = [1, 2, 3];
arr.[1](5);
console.log(arr);

Drag options to blanks, or click blank then click option'

Apop

Bpush

Cunshift

Dshift

Attempts:

3 left

💡 Hint

Common Mistakes

Using push() instead of unshift(), which adds at the end.

Using pop() or shift(), which remove elements instead of adding.

The unshift() method adds one or more elements to the beginning of an array.

2fill in blank

medium

Complete the code to insert the string 'start' at the beginning of the array.

DSA Javascript

const items = ['middle', 'end'];
items.[1]('start');
console.log(items);

Drag options to blanks, or click blank then click option'

Aunshift

Bpop

Cpush

Dshift

Attempts:

3 left

💡 Hint

Common Mistakes

Using push() which adds at the end, not the beginning.

Using pop() or shift() which remove elements.

unshift() adds the element 'start' at the beginning of the array.

3fill in blank

hard

Fix the error in the code to correctly insert 10 at the beginning of the array.

DSA Javascript

let numbers = [20, 30, 40];
numbers.[1](10);
console.log(numbers);

Drag options to blanks, or click blank then click option'

Aunshift

Bpush

Cpop

Dshift

Attempts:

3 left

💡 Hint

Common Mistakes

Using push() which adds at the end.

Using pop() or shift() which remove elements.

unshift() correctly inserts 10 at the beginning of the array.

4fill in blank

hard

Fill both blanks to insert 'first' at the beginning and remove the last element.

DSA Javascript

let arr = ['second', 'third', 'fourth'];
arr.[1]('first');
arr.[2]();
console.log(arr);

Drag options to blanks, or click blank then click option'

Aunshift

Bpush

Cpop

Dshift

Attempts:

3 left

💡 Hint

Common Mistakes

Using push() instead of unshift() to add at the start.

Using shift() instead of pop() to remove the last element.

unshift() adds 'first' at the start; pop() removes the last element.

5fill in blank

hard

Fill all three blanks to insert 0 at the beginning, add 4 at the end, and remove the first element.

DSA Javascript

let nums = [1, 2, 3];
nums.[1](0);
nums.[2](4);
nums.[3]();
console.log(nums);

Drag options to blanks, or click blank then click option'

Aunshift

Bpush

Cshift

Dpop

Attempts:

3 left

💡 Hint

Common Mistakes

Mixing up shift() and pop() for removing elements.

Using push() to add at the beginning instead of unshift().

unshift() adds 0 at start; push() adds 4 at end; shift() removes first element.

Practice

1. What does the unshift() method do in a JavaScript array?

easy

A. Adds one or more elements to the beginning of the array

B. Removes the first element from the array

C. Adds one or more elements to the end of the array

D. Removes the last element from the array

Solution

1. Step 1: Understand the unshift() method

   The unshift() method adds elements to the start of an array, shifting existing elements to the right.

2. Step 2: Compare with other array methods

   push() adds to the end, shift() removes from the start, and pop() removes from the end.

3. Final Answer:

   Adds one or more elements to the beginning of the array -> Option A

4. Quick Check:

   unshift() adds at start = B [OK]

Hint: Remember: unshift = add at front [OK]

Common Mistakes:

• Confusing unshift() with push()
• Thinking unshift() removes elements
• Mixing unshift() with shift()

2. Which of the following is the correct syntax to insert the value 10 at the beginning of array arr?

easy

A. arr.pushFront(10);

B. arr.addFirst(10);

C. arr.unshift(10);

D. arr.insertAt(0, 10);

Solution

1. Step 1: Recall JavaScript array methods

   JavaScript arrays use unshift() to add elements at the start.

2. Step 2: Check each option

   Only arr.unshift(10); is valid JavaScript syntax for this operation.

3. Final Answer:

   arr.unshift(10); -> Option C

4. Quick Check:

   Correct syntax for start insertion = A [OK]

Hint: Use unshift() to add at start, push() for end [OK]

Common Mistakes:

• Using non-existent methods like addFirst or pushFront
• Confusing unshift() with push()
• Trying to use insertAt which is not a JS array method

3. What will be the output of the following code?

let arr = [2, 3, 4];
arr.unshift(1);
console.log(arr);

medium

A. [1, 3, 4]

B. [1, 2, 3, 4]

C. [2, 3, 4, 1]

D. [2, 3, 4]

Solution

1. Step 1: Understand unshift effect on array

   The unshift(1) adds 1 at the start, shifting existing elements right.

2. Step 2: Trace the array after unshift

   Original array: [2, 3, 4]
   After unshift(1): [1, 2, 3, 4]

3. Final Answer:

   [1, 2, 3, 4] -> Option B

4. Quick Check:

   unshift adds at front = [1, 2, 3, 4] [OK]

Hint: unshift adds element at front, shifts others right [OK]

Common Mistakes:

• Thinking unshift adds at end
• Ignoring that unshift shifts elements
• Expecting original array unchanged

4. Identify the error in the following code that tries to insert 0 at the beginning of array nums:

let nums = [1, 2, 3];
nums.unshift = 0;
console.log(nums);

medium

A. Using assignment instead of calling unshift as a function

B. Array nums is not defined

C. unshift cannot add zero

D. Syntax error due to missing parentheses

Solution

1. Step 1: Analyze the assignment to unshift property

   The code assigns 0 to nums.unshift, overwriting the method instead of calling it.

2. Step 2: Correct usage of unshift

   To add 0 at start, call nums.unshift(0); as a function, not assign a value.

3. Final Answer:

   Using assignment instead of calling unshift as a function -> Option A

4. Quick Check:

   unshift must be called, not assigned = A [OK]

Hint: Call unshift() as function, don't assign it a value [OK]

Common Mistakes:

• Assigning value to unshift instead of calling it
• Missing parentheses when calling unshift
• Thinking unshift is a property, not a method

5. Given the array let data = [5, 6, 7];, which code snippet correctly inserts the numbers 2, 3, 4 at the beginning so that the final array is [2, 3, 4, 5, 6, 7]?

hard

A. data.unshift([2, 3, 4]);

B. data.splice(0, 0, [2, 3, 4]);

C. data.push(2, 3, 4);

D. data.unshift(2, 3, 4);

Solution

1. Step 1: Understand unshift with multiple arguments

   The unshift() method can take multiple arguments and adds them all at the start in order.

2. Step 2: Analyze each option's effect

   data.unshift([2, 3, 4]); adds a single array as first element, resulting in nested array.
   data.unshift(2, 3, 4); adds 2, 3, 4 individually at start, producing desired array.
   data.push(2, 3, 4); adds elements at end.
   data.splice(0, 0, [2, 3, 4]); inserts a single array at index 0, nesting again.

3. Final Answer:

   data.unshift(2, 3, 4); -> Option D

4. Quick Check:

   unshift multiple args adds all at front = D [OK]

Hint: Pass multiple values to unshift() to add all at start [OK]

Common Mistakes:

• Passing an array instead of separate values to unshift
• Using push() which adds at end
• Using splice() incorrectly causing nested arrays