javascript

JavaScript includes()메서드

유니유뉘 2023. 3. 11. 14:26
728x90

JavaScript includes() 메서드에 대해서

includes() 메서드는 무엇일까?

includes() 메서드는 배열이 특정 요소를 포함하고 있는지 판별한다.

arr.includes(valueToFind[, fromIndex])
  • valueToFind : 탐색할 요소, 문자나 문자열을 비교할 때, includes()는 대소문자를 구분한다.
  • fromIndex : 이 배열에서 searchElement 검색을 시작할 위치이다. 음의 값은 array.length + fromIndex의 인덱스를 asc로 검색한다. 기본값은 0이다.

이 함수를 사용하면 반환값은 boolean(true/false)이다.

let array = [1,2,3];

array.includes(2); //true
array.includes(4); //false
array.includes(3, 3); //false
array.includes(3, -1); // true
[1, 2, NaN].includes(NaN); // true

여기에서 array.includes(3, 3); 를 살펴보면 결괏값으로 false가 반환이 된다.

false가 반환되는 이유는 간단하다. 3인 요소를 3번째 인덱스에서 찾겠다는 의미인데 array 변수의 요소값을 보면 3번째 인덱스가 있지 않지 않고 3이란 요소도 없으니 false가 반환이 된다.

⇒ fromIndex가 배열의 길이보다 같거나 크다면 false를 반환

array.includes(3, -1); 를 살펴보면 3인 요소값을 array에서 찾겠다는 의미인데 -1은 배열 끝에서부터 검색을 시작한다는 의미이다. 그러므로 마지막 인덱스인 array [2]에서 찾겠다는 건데 이 이전 요소인 3을 찾았기에 true를 반환한다.

하지만 검색 대상이 문자열인 경우, -1을 전달하면 검색을 끝에서부터 시작할지 또는 전체 문자열에서 검색을 시작할지에 따라 결과가 달라질 수 있습니다. 따라서 -1을 사용하기 전에 검색 대상의 종류에 따라 예상되는 결과를 확인해야 합니다.

0보다 작은 인덱스의 계산

fromIndex 값이 -1보다 작은 경우, 전체 배열 또는 문자열에서 검색을 시작합니다.

fromIndex가 음수라면 valueToFind를 찾기 시작할 배열의 위치로 사용되기 위해 연산된다. 만약 계산된 인덱스는 fromIndex + array.length로 계산한다.

const arr = [1, 2, 3, 4, 5];

console.log(arr.includes(2, -4)); // true

arr의 length는 5, fromIndex는 -4 ⇒ 5 + (-4) = 1인데

배열의 1번째 요소 부터 검색이 시작되고 1을 찾아 true를 반환한다.

const arr = [1, 2, 3, 4, 5];

console.log(arr.includes(2, -3)); // false

false를 반환하는 이유는 length : 5 , findIndex는 -3/ 5+ (-3) =2

2번째 인덱스부터 2를 찾는다는 의미인데 arr[2]는 3이므로 3부터 시작해서 요소 2를 찾으면 없기에 false를 반환한다.

 

한눈에 보고 싶으시면 노션을 보셔도 됩니다!!

 

반응형