[Dseok의 코딩스터디] javascript / indexOf() Method / 자바스크립트 indexOf() 메소드 / 자바스크립트 indexOf() 메소드 활용 / Array.prototype.indexOf()

오늘은 Array에 있는 indexOf() 메소드에 대해서 알아보자.

indexOf()메소드는 String, 문자열에서도 사용을 할 수 있는 메소드이다.(MDN참고)

 

하지만 지금은 Array에 있는 indexOf()를 알아보자.

MDN 설명이다.

indexOf()
메서드는 배열에서 지정된 요소를 찾을 수 있는 첫 번째 인덱스를 반환하고 존재하지 않으면 -1을 반환합니다.

indexOf()는 엄격한 동등성 (=== 또는 triple-equals 연산자에서 사용하는 것과 같은 메서드)을 사용하여 검색 요소를 Array의 요소와 비교합니다.

쉽게 말하면

내가 검색해야할 배열(데이터)에 내가 원하는 원소(자료)가 있으면 그 원소(자료)가 처음 보여지는 순서를 값으로 내놓고, 없으면 -1을 내놓는다.

 

indexOf()의 문법을 보자.

arr.indexOf(searchElement[, fromIndex])

indexOf()는 2개의 인자를 받는다.

1. searchElement: 배열에서 찾고자 하는 원소(자료)를 말한다.

2. fromIndex

: 어디서부터 검색하기를 원하는지를 넣어주면 된다. 옵션이므로 넣어도되고 넣지 않아도 된다.

 

백문이불여일타.

예시 코드를 보자.

 

const array = [2, 9, 9];
array.indexOf(2);     // 0
array.indexOf(7);     // -1
array.indexOf(9, 2);  // 2
array.indexOf(2, -1); // -1
array.indexOf(2, -3); // 0

위 코드에서 보다시피 2는 첫번째에 있으니 0을 출력, 배열의 맨 처음에 있는 순서값은 0이다. 컴퓨터는 0부터 숫자를 센다.

array.indexOf(9, 2)에서는 9를 찾되 첫 번째 9는 필요 없으니 2번째 9의 위치를 내놔라. 라는 뜻이다.

 

 

하나씩 찾으니 답답하다.

내가 원하는 값의 모든 위치를 찾아줘라.

let indices = [];
const array = ['a', 'b', 'a', 'c', 'a', 'd'];
const element = 'a';
const idx = array.indexOf(element);
while (idx != -1) {
  indices.push(idx);
  idx = array.indexOf(element, idx + 1);
}
console.log(indices);
// [0, 2, 4]

이렇게 하면 내가 찾고자하는 원소(자료)의 위치 값을 반환해준다.

 

Array.prototype.indexOf()의 실제 사용할 수 있는 사용 예시들을 알아보자.

 

1. 중복 요소 확인 및 제거

2. 특정 값의 존재 여부 확인

3. 배열 안에서 특정 값의 모든 인덱스 확인

4. 특정 값의 첫 번째 등장 위치 확인

5. 특정 값의 마지막 등장 위치 확인

6. 특정 값의 등장 횟수 확인

7. 콜백 함수를 사용한 조건에 따른 검색

 

이정도의 실제 활용 예시들을 알아볼 수 있을 것 같다

이중에 중복 요소 확인 및 제거에 대한 예시를 알아보자.

 

const fruits = ['사과', '바나나', '오렌지', '사과', '포도', '바나나'];

function 이중요소제거함수(arr) {
  const 제거하고넣을배열 = [];
  for (const item of arr) {
    if (제거하고넣을배열.indexOf(item) === -1) {
      제거하고넣을배열.push(item);
    }
  }
  return 제거하고넣을배열;
}

const 제거됨 = 이중요소제거함수(fruits);
console.log(제거됨); // ['사과', '바나나', '오렌지', '포도']

 

indexOf는 단순한 값을 찾을 수 있다.

인자에 함수를 넣어서 사용하고 싶으면 findIndex()메소드를 사용해야한다.

 

다음에 알아보자.