본문 바로가기

JavaScript

Javascript - 정규표현식

정규표현식

자바스크립트

2019-10-30 18:05:29


regular expression

문자열 안에서 어떠한 문자가 있는지, 없는지

또는 다른 문자로 치환해주는 것.

 

1. 컴파일 단계. 

 =우리가 필요한 대상을 찾는 것. 패턴을 찾는 것. 

2. 실행 단계.

=우리가 찾은 패턴 · 대상에 대해 어떠한 작업을 구체적으로 하는 단계.

 

▶ 정규표현식에서 패턴을 만드는 방법.

1. 정규표현식 리터럴.

var pattern = /a/;

 

2. 정규표현식 객체 생성자

var pattern = new RegExp('a');

정규표현식 객체를 만들었다.

 

 정규표현식 메소드 실행

정규표현식의 주요 작업 : 추출. 테스트. 치환  

 

1. 추출

var pattern = /a/;

console.log(pattern. exec('abcde'));

 

a 라는 추출해내고자 하는 인자를 pattern 이라는 변수에 담았다.

pattern.exec('문서'); 를 통해 문서속에 들어 있는 a 를 추출해낼 것이다.

 

결과 : ["a"]

배열을 담는 대괄호 속에 a 가 문자열로 나왔다.

 

찾고자하는 패턴을 /a./ 으로 바꿔 실행해보자

var pattern = /a./;

console.log(pattern. exec('abcde'));

 

결과: ["ab"]

이로인해 . 이 a뒤에 있는 문자 1개를 의미한다는 것을 알았다.

a뒤에 있는 문자 1개까지 함께 추출되었다.

 

var pattern = /a/;

console.log(pattern.exec('bcdef'));

 

결과: null

값이 없음.

2. test

var pattern = /a/;

console.log(pattern.test('abcde'));

 

결과: true

test 는 리턴 값이 블린이다.

true/false 로 나타난다.

 

3. match

var pattern = /a/;

var str = 'abcdef';

console.log(str.match(pattern));

 

결과: ["a"]

값이 없을때에는 null

 

4. replace

var pattern = /a/;

var str = 'abcdef';

str.replace(pattern, 'A');

 

결과: "Abcdef"

문서. replace(대상, '바꿀 내용');

으로 a(대상) 가 A(바꿀 내용) 로 바뀌었다.

 

▶ 정규표현식의 옵션

-i, g

i : 패턴의 대소문자를 구분하지 않는다.

g :  검색된 모든 결과를 리턴한다. (여러 번 쓰였으면 쓰인 만큼 모두 리턴.)

 

var oi = /a/i;

"Abcde".match(oi);

결과: ["A"]

변수 oi 에 소문자 a 를 넣었지만,

대문자 A가 나왔다.

 

var og = /a/g;

"abcdea".match(og);

결과 : ["a", "a"]

 

var ig = /a/ig;

"AabcdAa".match(ig);

결과: ["A", "a", "A", "a"]

 

-캡처

/(\w+)\s(\w+)/;

이 정규표현식이 뭘지 알아보자.

정규표현식을 시각화

   : 정규표현식을 시각화해줌. (\w+)\s(\w+) 요 부분만 검색하면 된다.

이렇게 알려준다.

\w : 문자. a~z, A~Z, 0~9. 를 의미.

+ : 수량자. 앞의 문자가 하나 이상인 경우 이 패턴이 유효해진다.

     문자가 아닐 경우, 혹은 하나 이상이 아닐경우 패턴이 유효하지 않다.

\s : 공백.

 

 

정규표현식 빌더

      : 패턴((\w+)\s(\w+)) 입력 후 아래 창에 작성을 하면 위 패턴과

        일치하는지 알려준다.

파란색 박스가 뜨면 일치한다는 뜻.

 

 

 

 

 

이제 사용해보자!

 

var pattern = /(\w+)\s(\w+)/;
var str = "coding everybody";
var result = str.replace(pattern, "$2, $1");

console.log(result);

 

결과: everybody, coding

 

str.replace(pattern, "$2, $1"); 

이 부분 해석: pattern에 해당되는 문자(str=coding everybody)를

                  "$2, $1" 로 replace 시키겠다.

                   $2 : 패턴 속 두 번째 괄호를 의미.

                   $1 :  패턴 속 첫 번째 괄호를 의미.

 

∴ 정규표현식 pattern 에 맞게 작성된 변수 str을

$2 + 콤마 + 공백 + $1(="$2, $1")으로 대체했다.

 

'JavaScript' 카테고리의 다른 글

JavaScript - ==, === 차이점  (0) 2023.09.24
Javascript - 함수 유효범위  (0) 2023.03.13
Javascript - UI·API , 문서  (0) 2023.03.13
Javascript - 모듈  (0) 2023.03.13
Javascript - 객체  (0) 2023.03.13