[JavaScript] 자바스크립트 문자열 다루기 (정규 표현식 사용하기)

038_자바스크립트 문자열 다루기 (정규 표현식 사용하기)

[적용]

• 조건과 일치하는 문자열을 검색하고 싶을 때
• 많은 문자열을 패턴에 따라 일괄적으로 변환하고 싶을 때

---

 

[내용]

정규 표현을 사용하면 문자열의 변환과 검색이 더욱 간편하다.

예를 들어 접속한 브라우저가 iOS인지의 여부를 확인하고 싶을 때 유저 에이전트를 통해 iPhone/iPod/iPad의 포함 여부를 확인할 수 있다. 정규 표현을 사용한 코드와 사용하지 않은 코드를 비교해 보자.

// 정규 표현을 사용한 코드
if (/iPhone|iPod|iPad/.test(navigator.userAgent)) {
    alert('접속한 브라우저는 iOS입니다.');
}

// 정규 표현을 사용하지 않은 코드
if (
    navigator.userAgent.includes('iPhone') ||
    navigator.userAgent.includes('iPod') ||
    navigator.userAgent.includes('iPad')
) {
    alert('접속한 브라우저는 iOS입니다.');
}

 

문자열의 패턴(예를 들어 '/iPhone|iPod|iPad/' 부분)을 사용하여 특정 문자열과 일치 여부를 확인할 때 정규 표현을 사용하면 검색과 변환이 용이하다.

---

[APPENDIX]

정규 표현 패턴의 표기

문자열의 패턴은 내용의 앞뒤에 /를 삽입한다.

/패턴/

 

대표적인 패턴을 다음에서 확인해 보자.

패턴	의미
x	문자 x
xyz	문자열 xyz
[xyz]	x, y, z 증 하나의 문자
[a-z]	a~z 중 하나의 문자. [a-f], [A-Za-z] 방식도 가능
[^xyz]	x, y, z 외 하나의 문자
[^a-z]	a~z 외 하나의 문자
abc|xyz	문자열 abc 혹은 xyz
{숫자}	반복 횟수
^x	시작 문자 x
x$	종료 문자 x
.	하나의 문자(줄바꿈 코드 제외)
x*	0개 이상 계속되는 x(*1)
\	다음에 오는 문자를 이스케이프(escape) 처리(*2)
\d	숫자 [0-9]
\D	숫자가 아닌 문자 [^0-~9]
\w	영문, 숫자, 언더바 [A-Za-z0-9_]
\s	공백 문자(스페이스, 탭, 줄바꿈 등)
\S	공백 문자 이외의 문자 [^\s]
\t	수평 탭
\n	줄바꿈 코드

*1  'va*'는 v 뒤의 a가 0회 이상 계속되는 상태를 나타낸다.

*2  정규 표현으로 사용되는 문자의 이스케이프 처리를 위해 사용한다.

      예를 들어 [문자의 이스케이프 처리는 \[ 의 패턴을 사용한다.

---

[JavaScript] 자바스크립트에서 문자열 다루기

[JavaScript] 자바스크립트에서 문자열 다루기

---

[JavaScript] 자바스크립트에서 문자열의 길이(문자의 수)를 확인하고 싶을때 length()

[JavaScript] 자바스크립트 문자열의 길이 확인하기

---

[JavaScript] 자바스크립트 문자열의 공백 처리하기 trim()

[JavaScript] 자바스크립트 문자열의 공백 처리하기 trim()

---

[JavaScript] 자바스크립트에서 문자열 검색하기 (인덱스 검색)

[JavaScript] 자바스크립트에서 문자열(인덱스) 검색하기

---

[JavaScript] 자바스크립트에서 문자열 검색하기 (부분 검색)

[JavaScript] 자바스크립트에서 문자열 검색하기 (부분 검색)

---

[JavaScript] 자바스크립트에서 문자열에서 문자 다루기 (문자열에서 문자 추출하기)

[JavaScript] 자바스크립트 문자열에서 문자 다루기 (문자열에서 문자 추출하기)

---

[JavaScript] 자바스크립트 문자열에서 문자 다루기 (위치 지정하여 선택하기)

[JavaScript] 자바스크립트 문자열 다루기 (위치 지정하여 선택하기)

---

[JavaScript] 자바스크립트 문자열에서 문자 다루기 (글자수 지정하여 선택하기)

[JavaScript] 자바스크립트 문자열 다루기 (글자 수 지정하여 선택하기)

---

[JavaScript] 자바스크립트 지정 문자열 변환하기

[JavaScript] 자바스크립트 지정 문자열 변환하기

---

[JavaScript] 자바스크립트 문자열 나누기

[JavaScript] 자바스크립트 문자열 나누기

---

[JavaScript] 자바스크립트 문자열 합치기

[JavaScript] 자바스크립트 문자열 합치기

---

[JavaScript] 자바스크립트 문자열의 대소문자 변환하기

[JavaScript] 자바스크립트 문자열의 대소문자 변환하기

---

[JavaScript] 자바스크립트 문자열과 식 함께 다루기

[JavsScript] 자바스크립트 문자열과 식 함께 다루기

---

[JavaScript] 자바스크립트 문자열 다루기 (정규 표현식으로 특정 문자 검색하기)

[JavaScript] 자바스크립트 문자열 다루기 (정규 표현식으로 특정 문자 검색하기)

 

---

 

 

 

 

 

 

참조 :
실무에 바로 적용하는 자바스크립트 코드레시피 278
아케다 야스노부, 카노 타케시 지음 / 이춘혁 옮김