_.indexOf() | Lodash [자바스크립트]

Lodash의 _.indexOf 간단 정리.

 

_.indexOf = function(array, target) {
  var result = -1;
  
  _.each(array, function(item, index) {
    if (item === target && result === -1) {
      result = index;
    }
  });
  
  return result;
};

일단 _.each는

_.each = function(collection, iterator) {
    if (Array.isArray(collection)) {
      for (let i = 0; i < collection.length; i++) {
        iterator(collection[i], i, collection);
      }
    } else {
      for (const key in collection) {
        iterator(collection[key], key, collection);
      }
    }
  };

이렇게 써놨다.

반환값은 없고 배열 또는 객체를 훑으면서 각 요소를 콜백함수에 넣는다. 

입력값이 배열일 때 콜백함수의 첫 번째 매개변수는 요소, 둘째는 인덱스, 셋째는 해당 배열이다.

 

그럼 다시 _.indexOf로 돌아가면 이 함수는 매개변수로 배열(array)과 찾는 값(target)을 받는다.

최초 result 값을 -1로 지정한다. 찾는 값이 배열에 없으면 -1을 반환하기 위해서다.

그리고 요소들을 차례차례 콜백함수에 넣는다. 콜백함수의 매개변수는 요소(item)와 인덱스(i).

특정 요소 값이 찾는 값과 같으면(item === target) result에 인덱스를 담는 방식인데 조건에 result === -1이 있다.

result === -1을 지우고 함수를 돌려봤더니 찾는 값이 배열 속에 여러 개가 있을 때 가장 마지막 인덱스를 반환한다.

즉 _.indexOf는 찾는 값이 배열의 어느 지점에서 가장 먼저 나오는지 판별하기 위해 조건으로 (item === target && result === -1)을 걸었다.

const arr = [1, 1, 2];
_.indexOf(arr, 1);

이런 코드가 돌아가는 과정을 생각해 보면

  - 최초 result = -1

  - arr[0]이 target인 1과 같고 result가 -1이므로 조건식 true, result = 0으로 바뀜

  - arr[1]이 target과 같지만 더 이상 result가 -1이 아니므로 조건식 false, result 계속 0

  - arr[2]이 target과 다르므로 result 여전히 0

  - result 0 반환

&&가 왼쪽부터 falsey 값을 찾고 falsey 값이 나오면 해당 피연산자를, falsey 값이 끝까지 안 나오면 마지막 피연산자를 내보내는 성질을 사용한 것이다.