Array.includes 자바스크립트 배열 특정 값 포함 확인

원본: 자바스크립트 배열에 항목이 있는지 확인 – Array.includes()

자바스크립트의 메소드를 사용하면 특정 요소가 배열에 있는지 확인할 수 있습니다.

또한 이를 이용해 문자열 내에 하위 문자열이 있는지 확인할 수도 있습니다.

찾고자 하는 항목이 배열이나 문자열에 있으면 true를 리턴하고 항목이 없으면 false를 리턴합니다.

이번 포스트에서는 자바스크립트의 includes() 메소드를 사용하여 특정 항목이 배열 내에 있는지, 문자열 내의 하위 문자열로 있는지 알아내는 방법을 살펴보겠습니다.

includes() 메소드로 특정 값 포함 확인

배열의 특정 값을 확인하는 메소드 사용 구문은 다음과 같습니다:

array.includes(item, fromIndex);

위의 구문에서 array는 검사할 원본 배열을 나타냅니다.

매개변수로 item과 fromIndex 두 개의 값을 받습니다.

  • item: 찾고자 하는 특정한 항목 입니다.
  • fromIndex: 옵셔널 값으로 검색을 시작할 인덱스를 지정합니다. 이 값을 지정하지 않으면 기본 인덱스는 0으로 설정됩니다.

다음은 특정 항목이 존재하는지 여부를 체크하는 예제 코드 입니다:

const nums = [ 1, 3, 5, 7];

console.log(nums.includes(3));
includes() 메소드 사용 예제

개발자 도구에서 1, 3, 5, 7 이라는 네 개의 숫자를 가지는 nums 배열을 만들었습니다.

점 표기법을 사용하여 nums 배열에서 includes() 메소드를 호출했습니다.

이 메소드의 매개변수에 3을 전달했고 이 값은 배열에 있는지 확인할 값 입니다.

마지막으로 nums 배열에 3이 존재하기 때문에 true를 리턴하여 console.log() 메소드로 출력했습니다.

이제 위의 예제와는 반대로 배열에 존재하지 않는 숫자를 검색해 보겠습니다:

const nums = [1, 3, 5, 7];
console.log(nums.includes(8));
includes() 사용 예제

예상한 대로 nums 배열에는 8이 없기 때문에 리턴 값은 false 입니다.

includes() 메소드로 지정된 인덱스에서 검색

앞의 예제에서는 메소드의 두 번째 매개변수 값을 사용하지 않고 특정 항목이 배열에 존재하는지 여부를 확인했습니다.

참고로 두 번째 매개변수는 항목 검색을 시작할 인덱스를 지정하는데 사용합니다.

배열의 인덱스는 0 부터 시작하므로 첫 번째 항목의 인덱스는 0, 두 번째 항목의 인덱스는 1, 세 번째 항목의 인덱스는 2 입니다.

다음은 두 번째 매개변수를 사용하는 예제입니다:

const nums = [1, 3, 5, 7];
console.log(nums.includes(3, 2));
특정 인덱스부터 검색

위의 예제에서는 배열에 3이 존재 하는데도 false를 리턴했습니다.

그 이유는 두 번째 매개변수에 2를 전달해 인덱스 2에서 부터 검색을 시작하도록 했기 때문입니다.

그러므로 검색을 시작할 값은 5 부터이고 [5, 7]에는 3 이라는 값이 없기 때문에 리턴 값은 false 입니다.

만일 검색을 시작할 인덱스로 1을 전달했다면 true를 리턴했을 것 입니다:

const nums = [1, 3, 5, 7];
console.log(nums.includes(3, 1));
includes() 메소드 사용 방법

includes() 메소드로 하위 문자열 검색

이전 섹션의 예제들과 마찬가지로 하위 문자열을 검색하려면 문자열에 점 표기법을 사용하여 메소드를 호출하면 됩니다.

사용 구문은 다음과 같습니다:

string.includes(substring, fromIndex);

다음은 실제 사용 예제입니다:

const bio = "I am a web developer";
console.log(bio.includes("web"));
하위 문자열 검색

위의 예제에서는 web 이라는 단어가 bio 변수에 포함되어 있기 때문에 true를 리턴했습니다.

배열에서의 사용 방법과 마찬가지로 문자열 검색을 시작할 두 번째 매개변수를 사용할 수 있습니다.

주의할 점은 공백을 포함해 각각의 문자 모두 인덱스를 가진다는 점 입니다.

다음은 이를 보여주는 예제입니다:

const bio = "I am a web developer";
console.log(bio.includes("web", 9));
includes 사용 예제

리턴 값은 false 입니다. 왜냐하면 인덱스 9의 값은 “e” 이기 때문입니다.

정리

이번 포스트에서는 자바스크립트의 includes() 메소드에 대해 알아봤습니다.

이는 배열에 특정 항목이 있는지 확인하고, 문자열 내에 하위 문자열이 존재하는지 여부를 확인할 수 있습니다.

또한 특정 값을 검색 시 0 번째 인덱스 부터 검색하는 예제들을 알아봤고, 지정된 인덱스 부터 검색하는 방법도 알아봤습니다.

관련 글

자바스크립트 튜토리얼