[JavaScript] 배열 특정 값 인덱스(index) 찾기(3) - findIndex()

 

 

indexOf(), lastIndexOf(), findIndex() 메서드를 이용하여

특정 값 index를 찾을 수 있습니다.

 

배열에서 특정 값 index를 찾는 방법을 알아보고 있습니다.

[JavaScript] 배열 특정 값 인덱스(index) 찾기(1) - indexOf()

[JavaScript] 배열 특정 값 인덱스(index) 찾기(2) - lastIndexOf()

 

배열 특정 값 인덱스(index) 찾기 - findIndex()

findIndex() 메서드를 이용하여

배열에서 특정 값의 index를 찾는 방법을 알아보겠습니다.

 

 

findIndex()

findIndex(callbackFn)
findIndex(callbackFn, thisArg)

findeIndex() 메서드는 배열에서 값을 찾는 조건을 callback 함수로 전달하고,
주어진 조건을 만족하는 첫 번째 index를 반환합니다.

조건에 일치하는 요소가 없으면 -1을 반환합니다.

findeIndex() 메서드는 배열이 아닌 객체에서의 호출도 가능합니다.

 

 

callbackFn

배열의 각 요소마다 실행할 함수입니다.

일치하는 요소가 발견되면 true값을 반환하고,

그렇지 않으면 false값을 반환합니다.

callback 함수는 다양한 조건들을 넣을 수 있습니다.

함수는 다음과 같은 인수와 함께 호출됩니다.

 

element

배열에서 처리 중인 현재 요소

 

index(생략 가능)

배열에서 처리 중인 현재 요소의 index

 

array(생략 가능)

findIndex() 함수가 호출된 배열

 

 

thisArg

callback 함수를 실행할 때 this로 사용할 값입니다.

 

 

반환값

callback 함수에 정의한 조건에 부합하는 배열의 첫 번째 index를 반환합니다.

조건에 일치하는 배열 값이 없다면 -1을 리턴합니다.

 

 

예제 1)

const ages = [3, 10, 16, 20];

console.log(ages.findIndex(checkAge)); //3

function checkAge(age) {
  return age > 16;
}

callback 함수에 배열의 값들이 순서대로 전달되고,

그 값이 16보다 작거나 같다는 

해당 조건에 부합하는 요소의 첫 번째 index를 반환합니다.

 

 

예제 2)

const arr = [2, 6, 8, 12];
function isOdd(element, index, array) {
  return (element % 2 == 1);
}

console.log(arr.findIndex(isOdd)); // -1

위 예제에서 

findIndex()를 사용하여 홀수를 포함하는 모든 인덱스를 찾고 있습니다.

홀수가 존재하지 않으므로 -1을 반환합니다.

 

 

예제 3)

const arr = [2, 6, 7, 12];
function isOdd(element, index, array) {
  return (element % 2 == 1);
}

console.log(arr.findIndex(isOdd)); // 2

위 예제에서 

findIndex()를 사용하여 홀수를 포함하는 모든 인덱스를 찾고 있습니다.

7은 홀수이므로 해당 인덱스 2를 반환합니다.

 

 

 

findIndex() 사용하여 객체 찾기

const fruits = [
  { name: 'apply', price: 900 },
  { name: 'banana', price: 1900 },
  { name: 'lemon', price: 800 },
];

function findfruits(element) {
  if (element.name === 'banana') return true;
  }
  
console.log(fruits.findIndex(findfruits)); // 1

위 예제처럼

배열의 element가 참조형 타입이 아닌 객체인 경우,

객체를 찾기 위한 조건을 callback 함수에 구현할 수 있습니다.

 

 

 

findIndex() 메서드를 이용한 방법을 마지막으로 

indexOf(), lastIndexOf(), findIndex() 메서드를 이용하여

특정 값 index를 찾는 방법을 알아보았습니다.