본문 바로가기

개발/기타

[JAVASCRIPT] 자바스크립트 배열 특정 요소 검색 includes()

배열의 특정 요소를 검색하는 방법 중 유용하게 실무에서 사용할 수 있는 includes()

php에서는 in_array()를 사용해서 특정 요소가 있는지 유 무를 체크 했는데 자바스크립트에도 이와 유사한 includes()가 있습니다.

 

사용방법

arr.includes(valueToFind[, fromIndex])

valueToFind : 찾고자 하는 배열요소

fromIndx : 특정 위치부터 배열의 요소를 찾을 때 사용

 

사용 예시 1 - 배열 요소 검색 

arr 배열에 apple, banana, tomato 값으로 초기화하여 변수를 생성했습니다.

banana라는 요소가 있는지 찾아보면 실제 데이터가 있기 때문에 true를 반환합니다.

히지만 orange를 검색하면 arr이라는 배열에 해당 값이 없기 때문에 false를 반환하게 됩니다.

const arr = ['apple', 'banana', 'tomato'];

console.log('result1: ', arr.includes('banana')); // true
    
console.log('result2: ', arr.includes('orange')); // false


// 실행결과
result1: true
result2: false

 

사용 예시 2 - 특정 위치부터 배열 요소 검색

fromIndx의 값은 검색하고자 하는 배열의 위치 값이라고 했습니다.

arr 배열 요소의 인덱스 값은 아래와 같다고 보시면 됩니다.

배열요소 apple banana tomato
인덱스 0 1 2
-3 -2 -1

 

첫 번째 예시 (result1)를 보면 검색 요소는 banana이고 위치는 0부터 검색이기 때문에 결과는 true입니다.

두 번째 예시 (result2)를 보면 검색 요소는 banana이고 위치는 1부터 검색이기 때문에 결과는 true입니다.

두 번째 예시 (result3)를 보면 검색 요소는 banana이고 위치는 2부터 검색이기 때문에 결과는 false입니다.

console.log('result1: ' + arr.includes('banana', 0)); // true
console.log('result2: ' + arr.includes('banana', 1)); // true
console.log('result3: ' + arr.includes('banana', 2)); // false


console.log('result4: ' + arr.includes('banana', -1)); // false
console.log('result5: ' + arr.includes('banana', -2)); // true
console.log('result6: ' + arr.includes('banana', -3)); // true

// 실행결과
result1: true
result2: true
result3: false

result4: false
result5: true
result6: true

 

실무에서 배열 요소 검색은 많이 사용하는 메서드 중 하나입니다.

간단한 함수이지만 기억해 두었다 하용하면 유용하게 쓰임에 맞게 사용하실 수 있을 거라 생각됩니다.