Regular Expression

기초 정규 표현식


var myMatch = /hello/;

var exeBtn = document.getElementById('exe01');
var tb = document.getElementById('testboard');
exeBtn.onclick = function  () {
	var quote = "To be, or not to be.";
	var searchPosition = quote.indexOf('To be');
	tb.innerHTML = searchPosition;
}
						

정규표현식 구성 문자

정규표현식 문자
문자 대응
. 한 개의 영문자, 숫자, 공백, 기호
\w a-z,A-Z의 문자와 0-9의 숫자 그리고 언더스코어 문자(_)
\W 단어 문자가 아닌 문자. \w의 반대
\d 0-9의 숫자.
\D 숫자가 아닌 문자 \d의 반대.
\s 공백, 탭, 캐리지 리턴(\r), 새줄(\n)
\S 공백이 아닌 문자. \s의 반대.
^ 문자열의 시작. 찾고자 하는 문자열 앞에 어떤 문자도 없기를 바랄 때 유용하다.
$ 문자열의 끝. 문자열 끝에서 문자를 찾고자 할 때 사용한다. 예를 들어, /com$/는 문자열 "com" 뿐만 아니라 문자열 끝에 "com"이 있으면 어디에도 일치한다. 다시 말해, /com$/sms "infocom"의 "com"에는 일치하지만, "communication"의 "com"에는 일치하지 않는다.
\b 공백, 문자열의 시작, 문자열의 끝, 혹은 +,=, ' 등과 같이 문자나 숫자가 아닌 문자를 뜻한다. 단어의 시작이나 끝에 있는 단어에도 사용할 수 있다.
[ ] 대괄호 사이의 문자들 중 하나. 예를 들어 [aeiou]는 문자열에서 괄호 안에 있는 문자들 중 어느 것과도 대응된다. 문자를 범위로 나타내기 위해, 하이픈을 사용한다. 예를 들어, [a-z]는 모든 소문자 하나와 대응하고 [0-9]는 모든 한 자리 숫자와 대응한다(\d와 동일).
[^ ] 대괄호 사이의 문자들을 제외한 문자. 예를 들어 [^aeiouAEIOU]는 영어 모음을 제외한 모든 문자에 대응한다. 또한,[^0-9]는 숫자가 아닌 문자와 대응한다(\d와 동일).
| 문자 앞이나 뒤의 문자 중 하나. 예를 들어, a|b는 a 또는 b에 대응한다(이 기호의 실제 사용사례는 164페이지를 참고).
\ 정규식 특수 기호(예를 들어 *, ., \, / 등)를 이스케이프해서 문자열에서 검색할 수 있도록 한다. 예를 들어, .는 정규식에서 "모든 문자"를 의미하지만, 문자열에서 찾고 싶은 것이 마침표라면 기호를 \.와 같이 이스케이프해야 한다.
var zipTest = /^\d\d\d\d\d$/; // 정규식을 만듭니다.
if (zip.search(zipTest) == -1){
	alert('우편번호 형식이 올바르지 않습니다.');
}else{
	//올바른 우편번호입니다.
}
						
var testString = 'This file is logo.gif'; // 원본 문자열
var gifRegex = /\S*\.gif/i; // 정규표현식
var results = testString.match(gifRegex);
var file = results[0]; // logo.gif;
alert(file);
						

서브 패턴

정규표현식 서브패턴
문자 대응
? 이전 요소(문자 또는 그룹)가 없거나 하나 있을 때 사용한다. 이전 요소는 없을 수 있지만, 나타나면 한 번만 나타난다는 의미이다. 예를 들어. colou?r은 "color", "colour"에는 일치하지만 "colouur"과는 일치하지 않는다.
+ 이전 요소가 한 번 이상 반복될 때, 이전 요소가 최소한 한 번은 나타나야 한다.
* 이전 요소가 없거나 한 번 이상 반복될 때, 이전 요소는 없을 수 있지만, 여러 번 나타날 수도 있다. 예컨대, .*는 모든 여러 개의 문자에 대응한다.
{n} 이전 요소가 n번 나타날 때, 예컨대, \d{3}은 연속된 3개의 숫자에 대응한다.
{n, } 이전 요소가 n번 이상 나타날 때, 예를 들어, a{2, }는 "a"가 두 번 이상 나타나면 일치한다. 이 패턴은 "aardvark"라는 단어에서 "aa"와 일치하고, "aaaahhhh"라는 단어에서 "aaaa"와 일치한다.
{n,m} 이전 요소가 적게는 n번에서 많게는 m번까지 나타날 때, \d{3,4}는 3개 혹은 4개의 연속된 숫자에 대응한다(하지만 2개나 5개의 숫자에는 대응하지 않는다).

변경자(modifier)

정규표현식 서브패턴
문자 대응
i 정규식 표현의 대소문자를 구별하지 않는다.
g global search

유용한 정규표현식

우편번호

var zipKorea = /\d{3}-?\d{3}/; 


						
  • \d{3}은 501과 같은 3자리 숫자에 대응합니다.
  • -?는 하이픈을 찾는데, 이 하이픈이 없을 수도 있으며 혹은 한 번만 나타납니다. ?기호는 이전 요소가 없거나 혹은 한 번만 나타난다는 의미인데 여기서 이전 요소는 -입니다. 덕분에 이 정규식은 123456 혹은 123-456 모두에 대응합니다.
  • \d{3}은 456과 같은 3자리 숫자에 대응합니다.

Tip
전체 문자열이 정규표현식에 일치하는지 확인하려면, 정규식을 ^로 시작하고 $로 끝맺음합니다. 예를 들어, 어떤 사람이 우편번호란에 입력한 값이 정확한 우편번호인지 확인하려면, 정규식을 /^\d{3}-?\d{3}$/와 같이 작성해서 "blah 123-456 blah blah"와 같은 입력을 방지할 수 있습니다.

전화번호

var phone = /\(?(\d{2,3})\)?[ -.](\d{3,4})[ -.](\d{4})/;


						
  • \(는 여는 괄호 문자에 대응합니다. 정규식에서 괄호는 서브 패턴을 만들기 위해 사용하므로, 여는 괄호는 정규식에서 특수한 의미가 있습니다. 따라서, 자바스크립트 해석기가 괄호를 여기 괄호 문자에 대응하게 하려면, 백슬래시로 문자를 이스케이프해 주어야 합니다.
  • ?기호는 (문자가 선택적임을 가리킵니다. 따라서, 02-1234-5678과 같이 지역번호에 괄호를 사용하지 않는 전화번호도 찾을 수 있습니다.
  • (\d[2,3])은 2자리 혹은 3자리의 숫자에 대응하는 서브 패턴입니다. 지역번호는 2자리(02) 혹은 3자리(031)일 수 있으므로, 중괄호 수량자를 사용해서 2개 혹은 3개의 연속된 숫자를 표시했습니다.
  • \)?는 선택적인 닫는 괄호에 대응합니다.ㄴ
  • [ -.]는 공백, 하이픈, 마침표 중 하나에 대응합니다. (마침표는 정규표현식에서 "모든 한 문자"에 대응하는 특수 기호이므로, 일반적으로 마침표 문자 그 자체에 대응하려면 \.와 같이 이스케이프를 해주어야 합니다. 하지만, 대괄호 안에서는 이스케이프를 하지 않아도 마침표를 문자 그대로 해석합니다.)
  • (\d[3,4])는 3자리 혹은 4자리 숫자에 대응하는 서브 패턴 입니다.
  • [ -.]는 앞에서 설명했으므로 생략합니다.
  • (\d{4})는 4자리 숫자에 대응하는 서브 패턴입니다.

Tip
서브 패턴은 위의 전화번호 정규표현식에서 (\d{2,3})과 같이 괄호 안에 나타나는 패턴입니다. replace() 메소드와 함께 사용하면 아주 편리합니다.

이메일 주소

var email = /[-\w.]+@([ A-z0-9][ -A-z0-9]+\.)+[ A-z]{2,4}/;
// 정밀 Email 정규식
var emailDetail = /^[\w!#$%&\'*+\/=?^`{|}~.-]+@(?:[ a-z\d][ a-z\d-]*(?:\.[ a-z\d][ a-z\d-]*)?)+\.(?:[a-z][a-z\d-]+)$/i;
						
  • [-\w.]+는 하이픈, 영문자, 숫자, 언더스코어(_), 그리고 마침표가 한 번 이상 반복되는 것에 대응합니다. (\w는 영문자, 숫자, 언더스코어에 대응합니다.)
  • @는 메일 주소에 있는 @ 기호입니다.
  • [A-z0-9]는 하나의 영문자나 숫자에 대응합니다.
  • [-A-z0-9]+는 하나 이상의 영문자, 숫자, 하이픈에 대응합니다. 도메인은 하이픈을 포함할 수 있으나, 하이픈이 첫 글자가 될 수 없으므로 이 규칙 앞에 하이픈을 제외한 규칙을 사용했습니다.
  • \.는 도메인에 있는 마침표에 대응합니다.
  • +는 위의 세 규칙을 한 번 이상 반복한다는 것입니다. bob@mail.sawmac.com과 같은 서브 도메인도 찾기 위해서 사용했습니다.
  • [A-z]{2,4}는 2,3,4자리 영문자에 대응합니다. .com에서는 com, .kr에서는 kr에 대응합니다.

Note
위의 이메일 정규식은 기술적으로 가능한 모든 메일 주소에 대응하지는 못합니다. 예를 들어, !#$%&'+-/=?^_.`{|}~@example.com은 기술적으로는 유효한 메일 주소입니다만, 사람들이 실제로 사용하는 메일 주소를 위해 작성한 이 정규식과는 일치하지 않습니다. 정확한 정규표현식을 원하신다면, 다음 정규식을 사용하면 됩니다(한 줄에 입력하세요).
/^[\w!#$%&\'*+\/=?^`{|}~.-]+@(?:[ a-z\d][ a-z\d-]*(?:\.[ a-z\d][ a-z\d-]*)?)+\.(?:[a-z][a-z\d-]+)$/i

날짜

var date = /(\d[4])[-/\ .] ([01]?\d)[-\/ .] ([ 0123]?\d)/;


						
  • 첫 번째 ()는 연도에 해당하는 숫자에 대응합니다.
  • \d{4}는 1988이나 2009와 같은 4자리 숫자에 대응합니다.
  • [-\/ .]는 하이픈, 슬래시, 마침표, 또는 공백 문자에 대응합니다. 이 문자들은 10/21, 10 21, 10.21, 10-21처럼 연도와 월을 구분하는 용도로 사용할 수 있는 문자들입니다.
  • 두 번째 서브 패턴인()는 이 다음에 나타나는 두 개의 정규식 패턴을 하나로 묶습니다. 월에 해당하는 숫자에 대응합니다.
  • [01]?는 패턴이 0이나 1에 대응하되, ?는 이 패턴이 없을 수도 있음을 가리킵니다. 이 숫자는 월에 대응하기 때문에 10의 자리가 1보다 클 수 없습니다. 그리고 1월부터 9월까지는 05 혹은 5를 둘다 사용할 수 있습니다. 그러므로 이 패턴은 선택적입니다.
  • \d는 모든 한 자리 숫자에 대응합니다.
  • [-\/ .]는 위와 같습니다.
  • 마지막 ()은 일자에 대응합니다.
  • [0123]?는 0, 1, 2, 3이 1번 나오거나 나오지 않는 것을 의미합니다. 한 달은 최대 31일이므로 앞 자리가 4인 경우는 없습니다. 따라서 10의 자리수에 올 수 있는 숫자는 앞으로 나열한 4개 숫자가 전부입니다. 월과 마찬가지로 일자는 9혹은 09와 같이 입력할 수 있으므로 이 패턴은 선택적입니다(? 기호가 이 패턴을 선택적으로 만듭니다).
  • \d 는 모든 한 자리 숫자에 대응합니다.

웹주소

var webAddress = /((\bhttps?:\/\/) | (\bwww\.))\S*/;
var webAddressDetail = /^((https?:\/\/) | (www\.))\S*$/;


						
  • (는 바깥쪽 그룸의 시작 부분입니다.
  • (는 안쪽 그룹의 시작 부분입니다.
  • \b는 단어의 시작에 대응합니다.
  • http는 웹 주소의 시작 부분인 http에 대응합니다.
  • s?는 선택적인 s를 가리킵니다. 보안 접속을 사용하는 웹 페이지는 https로 시작하므로 웹 주소는 http는 물론 https로도 시작할 수 있습니다.
  • :\/\/는 ://에 대응합니다. 슬래시 문자는 정규표현식에서 특수한 의미를 가지고 있으므로, 슬래시 문자 자체에 대응하려면 백슬래시를 앞에 추가해 이스케이프해야 합니다.
  • )는 안쪽 그룹의 끝 부분입니다. 종합해 보면, 이 그룹은 http:// 또는 https://에 대응합니다.
  • |는 "또는"의 의미를 가지고 있습니다.
  • (는 두 번째 안쪽 그룹의 시작 부분입니다.
  • \b는 단어의 시작에 대응합니다.
  • www\.는 www.에 대응합니다(마침표는 정규식에서 특수한 의미를 가진 문자입니다).
  • )는 두 번째 안쪽 그룹의 끝 부분입니다. 이 그룹은 URL이 http://가 아닌 www.로 시작하는 때 대응합니다.
  • )는 바깥쪽 그룹의 끝 부분입니다. 여기까지 종합해 보면 이 정규식은 http://, https://, 또는 www로 시작하는 문자열에 대응합니다.
  • /S*는 공백이 아닌 문자 0개 이상에 대응합니다.

Tip
문자열이 URL만 담고 있는지 확인하려면(URL을 포함한 것과는 다릅니다), ^와 $ 문자를 각각 정규식 처름과 마지막에 추가한 후 \b 문자를 제거합니다.
/^((https?:\/\/) | (www\.))\S*$/