replace, replaceAll

김태완·2022년 4월 29일
0

자바스크립트 문법

목록 보기
4/14
post-thumbnail

string타입을 조작해야하는 업무를 하게됐는데, 특정 값을 추출해서 변경하는 replace를 알아보자

replace

replace는 1회성으로 값을 변환해준다

let tokens = {token : "|brand_name|", value: "나이키"};
let str = "<div>오늘의 브랜드는 |brand_name|입니다</div>";

str.replace(tokens.token, tokens.value); 

console.log(str); // "<div>오늘의 브랜드는 나이키입니다</div>"

replaceAll

replaceAll은 해당되는 값을 모두 변환해준다 (기존에 없다가 생겨난건지 검색해보니 폴리필이 많이 존재한다)

let tokens = [{token : "|brand_name|", value: "나이키"}];
let str = "<div>오늘의 브랜드는 |brand_name|입니다</div> <div>오늘의 브랜드는 |brand_name|입니다</div> <div>오늘의 브랜드는 |brand_name|입니다</div> <div>오늘의 브랜드는 |brand_name|입니다</div>";

str.replaceAll(tokens.token, tokens.value); 

console.log(str); // "<div>오늘의 브랜드는 나이키입니다</div> <div>오늘의 브랜드는 나이키입니다</div> <div>오늘의 브랜드는 나이키입니다</div> <div>오늘의 브랜드는 나이키입니다</div>"

다수 token으로 치환

let tokens = [
	{token : "|brand_name|", value: "나이키"},
    {token : "|price|", value: 29900},
    {token : "|date|", value: "2022-04-29"},
];

let str = "<div>브랜드 : |brand_name| 가격 : |price| 날짜 : |date|</div>";

for(let v in tokens){
	str.replaceAll(tokens[v].token, tokens[v].value);
}

console.log(str); "<div>브랜드 : 나이키 가격 :29900 날짜 : 2022-04-29</div>"

RegExp

정규표현식을 쓴다면 str.replaceAll( regexp, 치환값)으로 사용도 가능하다

'aabbcc'.replaceAll(/b/g, '.');
"aa..cc"
profile
프론트엔드개발

0개의 댓글