First and Last Occurrence of Element in DSA Javascript - Execution Trace

Concept Flow - First and Last Occurrence of Element

Start

↓

Initialize first = -1, last = -1

↓

Traverse array from i=0 to end

↓

Check if array[i

Yes↓

If first == -1, set first = i

↓

Set last = i

↓

i = i+1

↓

Repeat until i == array.length

↓

Return first and last

↓

End

We scan the array once, updating first and last positions when we find the target element.

Execution Sample

DSA Javascript

function findFirstLast(arr, target) {
  let first = -1, last = -1;
  for (let i = 0; i < arr.length; i++) {
    if (arr[i] === target) {
      if (first === -1) first = i;
      last = i;
    }
  }
  return [first, last];
}

This code finds the first and last index of the target element in the array.

Execution Table

Step	Operation	Index i	arr[i]	Condition arr[i] == target	first	last	Visual State
1	Initialize first and last	-	-	-	-1	-1	first=-1, last=-1
2	Check arr[0]	0	5	No	-1	-1	No change
3	Check arr[1]	1	3	No	-1	-1	No change
4	Check arr[2]	2	7	Yes	2	2	first=2, last=2
5	Check arr[3]	3	7	Yes	2	3	last updated to 3
6	Check arr[4]	4	2	No	2	3	No change
7	Check arr[5]	5	7	Yes	2	5	last updated to 5
8	End of array	-	-	-	2	5	Return [2,5]

💡 Reached end of array, all elements checked.

Variable Tracker

Variable	Start	After Step 2	After Step 3	After Step 4	After Step 5	After Step 6	After Step 7	Final
first	-1	-1	-1	2	2	2	2	2
last	-1	-1	-1	2	3	3	5	5
i	-	0	1	2	3	4	5	-

Key Moments - 3 Insights

Why do we check if first == -1 before setting it?

Because first should store the earliest index where target appears. We only set it once at the first occurrence (see Step 4 in execution_table).

Why do we update last every time we find the target?

Because last should always point to the most recent occurrence of the target (see Steps 4, 5, 7). This way, after the loop, last is the last occurrence.

What if the target is not in the array at all?

first and last remain -1, indicating target not found (see initial values in Step 1 and no updates in execution_table).

Visual Quiz - 3 Questions

Look at the execution_table, what is the value of 'first' after Step 5?

A 3

B -1

C 2

D 5

💡 Hint

Check the 'first' column in execution_table row for Step 5.

At which step does the condition arr[i] == target become true for the first time?

A Step 4

B Step 2

C Step 3

D Step 5

💡 Hint

Look at the 'Condition arr[i] == target' column in execution_table.

If the target was 10 instead of 7, what would be the final values of first and last?

A [2, 5]

B [-1, -1]

C [0, 0]

D [5, 5]

💡 Hint

Refer to variable_tracker and key_moments about target not found.

Concept Snapshot

Find first and last occurrence of an element in an array:
- Initialize first and last as -1
- Loop through array indices
- If element matches target:
  - If first == -1, set first = current index
  - Always update last = current index
- After loop, return [first, last]
- If target not found, both remain -1

Full Transcript

This concept finds the first and last positions of a target element in an array by scanning it once. We start with first and last set to -1, meaning not found. As we check each element, if it matches the target, we set first if it's the first time, and update last every time. After checking all elements, we return the positions. If the target is not found, both remain -1. This is efficient and simple to implement.