[자바스크립트] replace() 문자 변환, 치환

Last Modified : 2019-08-08 / Created : 2014-01-09

270,423
View Count

주소 복사하기

자바스크립트를 사용해 특정 문자를 다른 문자로 치환하는 방법에 대하여 알아볼까합니다. 먼저 사용할 메소드는 replace() 입니다. 사용방법은 아래와 같습니다.

str_text.replace("찾을 문자열", "변경할 문자열")

자바스크립트의 replace()함수는 바꿀 문자열을 직접 입력하거나 또는 정규표현식을 사용할 수도 있습니다.

# replace() 함수 예제를 통해 알아보기

아래는 replace()를 사용한 문자를 치환하는 방법의 간단한 예제입니다.

var test = '가나다라 마바사 가나';
var result = test.replace('가', '나');

console.log(result);

실행 결과는 아래와 같습니다.

12 나나다라 마바사 가나

// 출력 결과는 맨 앞의 "가"는 "나"로 변경됨

보시는 것처럼 맨 앞의 "가" 문자가 "나"로 변환되었습니다. 하지만 뒤의 "가"는 변하지 않고 그대로 입니다. 그 이유는 replace()함수는 제일 먼저 일차하는 패턴만 변환 후 바꿀뿐 모든 텍스트를 바꾸지는 않기 때문입니다.

! 어떻게 해야 모든 텍스트를 바꿀 수 있을까, global option

물론 전체 문자를 모두 바꾸는 방법이 있습니다. 만약 모든 문자를 변경하길 원하면 정규표현식을 사용해 간단하게 모든 문자를 변경할 수 있습니다.

그럼 간단하게 정규표현식에 대하여 알아볼까요?

# 정규표현식(Reqular Expression)이란 무엇인가

이번에는 정규표현식을 알아봅니다. 정규표현식(Regular Expression) 정해진 규칙을 사용해 모든 문자를 변환할 수도... 숫자만 변환하거나 맨 처음 또는 맨 뒤만 변환할 수도 있습니다. 매우 강력한 기능을 가지고 있죠. 그럼 간단한 예제를 보세요.

! 정규표현식(Regular Expression)을 사용한 변환 알아보기 아래는 정규표현식을 사용하는 문법입니다.

str_text.replace(/찾을 문자열/gi, "변경할 문자열")

먼저 위의 예제를 정규표현식을 사용해 모두 바꾸어 보도록 하겠습니다. 아래 예제는 텍스트에 존재하는 모든 '가'를 찾아 '나'로 바꾸는 예제입니다.

var test = "가나다라 마바사 가나";
var result = test.replace( /가/gi, '나');

console.log(result);

아래는 위 코드의 수행 결과입니다.

나나다라 마바사 나나
// 포함된 모든 "가"는 "나"로 변환되었음

여기서 꼭 알아야 될 점은 나누기(/)표시안에 넣는 텍스트의 따옴표는 없어야 한다는 점입니다. 그리고 뒤의 gi는 다음을 의미합니다.