Javascript: Difficulty analyzing code that contains indexOf within a for loop

Question

I'm working on coderbyte challenge titled SecondGreatLow. We are given an array of numbers as a parameter and are supposed to return the second lowest # and the 2nd highest # of the given array.

I am using someone else's code - I am analyzing/reverse engineering it,but I am confused on one part. Here is the code:

function SecondGreatLow(arr) { 
  var unique = [arr[0]];
  for(var i = 1; i < arr.length; i++) {
    if (unique.indexOf(arr[i]) == -1) {
      unique.push(arr[i]);
    }
  }
  unique.sort(function(a,b){return a - b});
  var smallest = unique[1].toString();
  unique.reverse();
  var largest = unique[1].toString();

  return smallest + " " + largest; 

}

I am having difficulty with the first half of the code - specifically the indexOf statement.

From reading b/w the lines and looking at the bottom half of the code, I believe that the 1st top half of the code is getting rid of all repeat values? - All of the remaining non-repeated values are popped into the unique array, where we then get the 2nd lowest (unique[1]) and the 2nd highest (unique[1] on the reversed array) values.

But what does that if-statement do???

I know that if the indexOf == -1, then that means that the particular item looked for is not found.

But if we go thru it step by step...

var unique = [arr[0]];

^ That's taking the value of the 1st element in the given array/parameter and storing it in an array named "unique"

Then there's a for-loop that starts at index 1 (rather than 0)

for(var i = 1; i < arr.length; i++) {

^So, the for loop is running through the original array that was provided as a parameter (and not thru the unique array). But this is where I get confused-

if (unique.indexOf(arr[i]) == -1) {
  unique.push(arr[i]);

So let's say we're going thru the 1st iteration of the for-loop and i = 1... We want to find the index of arr[1], which would be the 2nd value of the array. BUT WHICH ARRAY? The indexOf method is being run on "unique", so are we finding the index of the 2nd value of the unique array (which currently only has (arr[0])??? Or are we finding the index of the 2nd value of the array that was passed in as a parameter?

There is no 2nd element/value in unique array on the 1st run thru the for loop (as there's only 1 value), so we'd be pushing that element / adding that element to the unique array.

Basically, I'm confused as to what the top half of the code is actually doing. Any help would be appreciated.

If you want to use an example, I guess, suppose that the array [7, 7, 12, 98, 106] is passed thru as a parameter...

Thanks in advance...

Answer 1

If the unique Array doesn't contain a value matching arr[i], add it to the unique array.

The reason the loop starts at i=1, is because arr[0] is already stored in unique. We're iterating over arr, and checking against unique, and adding to unique if the value doesn't exist.

As for your example, I've taken the snippet and added some logging to it. These are the results after every pass of the for-loop:

getUniques([7, 7, 12, 98, 106])
  ["start with 7", "7"]
  ["try 7", "7"]
  ["try 12", "7,12"]
  ["try 98", "7,12,98"]
  ["try 106", "7,12,98,106"]

RESULT: [7, 12, 98, 106]

Answer 2

for(var i = 1; i < arr.length; i++) {
   if (unique.indexOf(arr[i]) == -1) {
     unique.push(arr[i]);
   }
}

This code is looping through the length of the array starting from index 1 - not 0. Don't need to start at 0 because we can assume that the first item is unique

unique.indexOf is checking whether the array element exists in the unique array. If indexOf returns -1 this means the element does not exist in unique, so push it to the array, otherwise, the for loop will increment to the next item in the array