본문 바로가기
[ javascript ]

[RegExp 객체] 문자열 패턴 관리하는 정규표현식 : 패턴식, test(), 아이디, 비밀번호 패턴 설정, 핸드폰 번호 패턴 설정

by 히앤님 2020. 8. 7.
반응형
SMALL

RegExp 객체


자바스크립트 내장 객체 중 문자열의 패턴을 관리하는 객체.

정규표현식(Regular Expression)이라고 부른다.

주로 문자 검색(search), 문자 대체(replace), 문자 추출(extract)을 정규식 패턴으로 빠르게 수행할 수 있다.

실질적으로 입력 양식에 입력되거나 선택된 데이터를 DB에 올바르게 저장하기 위해 사전에 검사하는 유효성체크 시 사용하면 편하다.

숫자가 아닌 문자열만 관리한다.

 

< 객체 생성 형식 >

var 객체참조변수 = new DateRegExp( 패턴식 );

var 객체참조변수 = 패턴식 ;

-> 패턴식은 "" 또는 ''로 감싸지 않는다.

 

<메소드 호출>

객체참조변수.메소드(~)

 

<속성변수 호출>

객체참조변수.속성변수

 

(1) meta 문자

정규표현식을 구성하는 다양한 특수기호(패턴)과 그 기호의 의미들을 의미

meta 문자 설명 예시
^x 문자열 시작
: ^ 오른쪽 문자가 시작임을 의미
^[가-힣]
: 한글문자로 시작
x$ 문자열 종료
: $ 왼쪽 문자가 마지막임을 의미
a$
: 마지막이 a로 끝남
x+ 왼쪽 데이터가 1개 이상 등장 예정 [가-힣]+ : 한글문자 1개 이상
x* 왼쪽 데이터가 0개 이상 등장 예정
:존재할 수도, 안할 수도 있음
[가-힣]* : 한글문자 있?없?
x? 왼쪽 데이터가 0~1개 사이 등장 예정
:존재할 수도, 안할 수도 있음
[가-힣]? : 한글문자 있?없?
x|y or(또는)의 의미
<주의>사이 공백도 문자열 취급함
x|y : x 또는 y가 존재함
. 임의의 문자 하나
<주의> 공백도 포함
/^...a$/
: 임의의 문자 3개가 구성된 후 a로 끝남
[.] 점(.) 표시 www[.]tistory[.]com
패턴식 문법인 * + ? | . 자체를 문자로 인식하려면 [] 안에 삽입해야함.
[문자열] 문자열 중에 문자 하나 [가-힣] : 한글 중 하나
<주의> 공백도 문자열 취급함
[^문자열] 쓰여 있는 문자열 빼고 나머지 중에 문자 하나 [^가-힣] : 한글이 아닌 문자 중 하나
ex) A
[문자열1-문자열2] 문자열1~문자열2까지의 범위 [a-z] : a부터 z까지의 문자열
(문자열) 문자열 그룹화
/^(...[가-힣])a$/ -> a나A가a 출력
(x)(y) 그룹들의 집합으로,
앞에서부터 번호 부여해서 관리
/^(abc).(xyz)$/ -> abc나xyz 출력
abc로 시작해서 xyz로 끝남
(x)(?:y) 집합에 대한 예외로,
그룹 집합으로 관리되지 않음.
(x)(y)가 아닌 것
{n} 왼쪽 데이터가 n개 등장 [가-힣]{3} : 한글 3글자
{n,} 왼쪽 데이터가 n개 이상 등장 [가-힣]{3,} : 한글 3글자 이상
{n,m} 왼쪽 데이터가 n개~m개 사이 등장 [가-힣]{3,5} : 한글 3~5글자
\^  꺾음쇠(^) 표시 -
 \b backspace로 띄어쓰기 의미
 \B \b가 아닌 것
\s 공백문자 하나. [ ]와 동일
\S \s가 아닌 것
\d 0~9 사이 숫자 중 하나. [0-9]와 동일
\D \d가 아닌 것
\w 영대소문자 또는 한자리숫자 또는 _ 중 하나. [a-zA-Z0-9]와 동일
\W \w가 아닌 것
\n 줄바꿈 문자 표시
\t tab 문자 의미
\v 수직  tab 의미
\/ 슬래쉬(/) 표시
\: 콜론(:) 표시
$` 문자 대체시 일치한 문자 이전 값 참조
$' 문자 대체시 일치한 문자 이후 값 참조
$+ 문자 대체시 마지막으로 캡처된 값 참조
$& 문자 대체시 일치한 문자 결과 전체 참조
$_ 문자 대체시 입력(input)된 문자 전체 참조
$1~9 문자 대체시 캡처( )된 값 참조

는 자판에서 ₩를 의미

 

(2) 메소드

구성한 정규표현식을 다루는 다양한 메소드

메소드 문법 설명
exec 정규식.exec(문자열) 일치하는 하나의 정보(Array) 반환
test 정규식.test(문자열) 일치 여부(Boolean)를 true, false로 반환
match 문자열.match(정규식) 일치하는 문자열의 배열(Array) 반환
search 문자열.search(정규식) 일치하는 문자열의 인덱스(Number) 반환
replace 문자열.replace(정규식,대체문자) 일치하는 문자열을 대체하고 대체된 문자열(String) 반환
split 문자열.split(정규식) 일치하는 문자열을 분할하여 배열(Array)로 반환
toString 생성자_정규식.toString() 생성자 함수 방식의 정규식을 리터럴 방식의 문자열(String)로 반환

하단 예제에서 자세히 살펴보자.

 

(3) 플래그

표현식의 옵션. 표현식으로 검색하려는 문자 패턴에 옵션을 추가하는 것.

정규식 뒤에 붙여 사용한다.

플래그 설명
g 모든 문자와 여러 줄 일치(global)
i 영어 대소문자를 구분 않고 일치(insensitive, ignore case)
m 여러 줄 일치(multi line)
u 유니코드(unicode)
y lastIndex 속성으로 지정된 인덱스에서만 1회 일치(sticky)

 

<예제1>RegExp 객체를 이용해서 아이디와 암호 설정의 제한을 걸어보자.

1. 아이디를 변수에 저장하기

var id = "abc123";

 

2. 아이디 패턴을 관리하는 RegExp 객체를 생성하기

<기준> 1. 영어 소문자로 시작 2. 영소문자, 숫자, _ 로 구성하기 3. 길이는 6자~15자로 제한

var regExp = new RegExp( /[a-z][a-z0-9_]{5,14}$/ );

<주의> 길이 제한에서 6~15자이므로 컴퓨터가 인식하는 -1로 작성해 주어야 한다.

 

3. 아이디 패턴 적합 여부를 판단하고 true 또는 false 출력

if( regExp.test(id) ){
	document.write( id + " 는 아이디로 적합합니다.<hr>");
}
else{
	document.write( id + " 는 아이디로 부적합합니다.<hr>");
}

RegExp 객체의 test 메소드를 호출하여 true 또는 flase를 얻는다.

 

4. 암호를 변수에 저장하기

var pwd = "1234fff";

 

5. 암호 패턴을 관리하는 RegExp 객체를 생성하기

<기준> 1. 영소문자, 숫자, _ 로 구성하기 2. 길이는 5자~13자로 제한

var regExp = new RegExp( /[a-z0-9_]{4,12}$/ );

 

6. 암호패턴 적합 여부를 판단하고 true 또는 false 출력

if( regExp.test(pwd) ){
	document.write( pwd + " 는 암호로 적합합니다.<hr>");
}
else{
	document.write( pwd + " 는 암호로 부적합합니다.<hr>");
}

RegExp 객체의 test 메소드를 호출하여 true 또는 flase를 얻는다.

 

abc123 는 아이디로 적합합니다.
1234fff 는 암호로 적합합니다.

 

 

<예제2>RegExp 객체를 이용해서 핸드폰번호 설정의 제한을 걸어보자.

1. 번호를 변수에 저장하기

var phone = "010-2222-3333";

 

2. 번호 패턴을 관리하는 RegExp 객체를 생성하기

<기준> 1. 숫자 갯수가 3-3~4-3이어야함 2. 첫 숫자 3개는 010,011,016,017,019이어야함

var regExp = new RegExp( /^(010|011|016|017|019)-[0-9]{3,4}-[0-9]{4}$/ );

 

3. 아이디 패턴 적합 여부를 판단하고 true 또는 false 출력

if( regExp.test(phone) ){
	document.write( phone + " 는 번호로 적합합니다.<hr>");
}
else{
	document.write( phone + " 는 번호로 부적합합니다.<hr>");
}

RegExp 객체의 test 메소드를 호출하여 true 또는 flase를 얻는다.

 

010-2222-3333 는 번호로 적합합니다.

 

 

<예제3>RegExp 객체를 이용해서 이름 설정의 제한을 걸어보자.

1. 이름을 변수에 저장하기

var stu_name = "김뫄ma";

 

2. 번호 패턴을 관리하는 RegExp 객체를 생성하기

<기준> 1. 영문자 2자 이상 2. 한글 2자 이상 3. 한글, 영문자가 섞이면 안됨.

var regExp = new RegExp( /^([가-힣]{2,}|[a-zA-Z]{2,})$/ );

 

3. 아이디 패턴 적합 여부를 판단하고 true 또는 false 출력

if( regExp.test(stu_name) ){
	document.write( stu_name + " 는 한글 또는 영어이름으로 적합합니다.<hr>");
}
else{
	document.write( stu_name + " 는 한글 또는 영어이름으로 부적합합니다.<hr>");
}

RegExp 객체의 test 메소드를 호출하여 true 또는 flase를 얻는다.

 

김뫄ma 는 한글 또는 영어이름로 부적합합니다.

 

반응형
LIST

댓글