Web/JavaScript

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

코딩팩토리 2024. 5. 16. 02:14

자바스크립트에서 문자열이 다른 문자열에 포함되어 있는지 확인하는 방법에는 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처럼 오래된 브라우저에서는 지원되지 않을 수 있으므로 테스트 과정이 필요합니다.