[JavaScript] 자바스크립트 문자열 포함되어 있는지 확인하기(indexOf, include)

자바스크립트에서 문자열이 다른 문자열에 포함되어 있는지 확인하는 방법에는 includes() 메서드나 indexOf() 메서드를 사용하시면 됩니다. 이번 포스팅에서는 자바스크립트에 특정 문자열이 포함되어 있는지 확인하는 방법에 대해서 알아보도록 하겠습니다.

 

※ 대소문자 구분

아래에서 설명할 indexOf(), includes() 메서드는 찾는 문자열에서 대소문자를 구분합니다. 따라서 검색하려는 문자열의 대/소문자를 정확히 일치시켜야 합니다. 대소문자를 구분하지 않고 비교하려면 미리 문자열을 대소문자로 변환하여 비교하려 한다면 아래 글을 참고해 주세요.

[JavaScript] 자바스크립트 대/소문자 변환(toUpperCase, toLowerCase)

 

---

 

 자바스크립트 문자열 포함되어 있는지 확인하기 

indexOf 메서드 사용하기

//사용법
문자열.indexOf(찾는 문자열, 시작 위치, 종료 위치)

• 찾는 문자열 : 찾을 문자열이나 문자입니다. (필수 값)
• 시작 위치 : 검색을 시작할 인덱스입니다. 기본값은 0입니다. (선택 값)
• 종료 위치 : 검색을 종료할 인덱스입니다. 기본값은 문자열의 길이입니다. (선택 값)

 

See the Pen indexOf by wjdxo513 (@wjdxo513) on CodePen.

 

indexOf() 메서드는 문자열에서 찾고자 하는 문자열의 위치(인덱스)를 정수 값으로 반환하고, 일치하는 문자열이 없으면 -1을 반환합니다. 이를 활용하여 내가 찾고자 하는 문자열이 있는지 확인할 수 있습니다. 위의 예제처럼 -1이 리턴된다면 내가 찾고자 하는 문자열이 없다는 뜻이 되겠죠. 가장 추천드리는 방법입니다.

 

---

 

include() 메서드 사용하기

//사용법
문자열.includes(찾는 문자열, 시작 위치)

• 찾는 문자열 : 찾을 문자열이나 문자입니다. (필수 값)
• 시작 위치 : 검색을 시작할 인덱스입니다. 기본값은 0입니다. (선택 값)

 

See the Pen includes by wjdxo513 (@wjdxo513) on CodePen.

 

includes() 메서드는 문자열에서 찾고자 하는 문자열이 포함되어 있으면 true를 반환하고, 포함되어 있지 않으면 false를 반환합니다. 이를 통해 찾는 문자열의 포함 여부를 알 수 있습니다.

 

※ includes() 메서드는 ECMAScript 2015 (ES6) 이상의 버전에서 사용할 수 있습니다. 따라서  IE처럼 오래된 브라우저에서는 지원되지 않을 수 있으므로 테스트 과정이 필요합니다.