본문 바로가기
개발(Development)/JS(자바스크립트)

[자바스크립트] 문자열 여러번 반복 생성 방법 2가지

by 카레유 2020. 12. 4.

"a" 라는 문자를 여러개 이어붙여서 만들고 싶을 때가 있다.

 

"aaaaaaaaaa" 라고 쳐도 되지만, a가 1000개쯤 되면 직접 타이핑하는건 개발자스럽지 못하다.

(아닌가? 오히려 개발자스러운가?)

 

다른 언어에서는 "a" * 100을 해도 되는 경우가 있지만, 자바스크립트는 안 된다.

 

아래 두가지 방법으로 문자열을 n 개로 반복 생성할 수 있다.

 

# Javascript 문자 n번 반복 생성 방법

1. String.prototype.repeat(n)

: 문자열.repeat(n) => 문자열을 n번 반복 연결한 문자열 반환

  * n은 반복할 횟수(정수)

  * n을 생략하거나, 0으로 지정시, 빈 문자열 "" 반환

 

"a".repeat(3);  // "aaa" 반환

"abc".repeat(3);  // "abcabcabc" 반환


"a".repeat();  // "" 빈문자열 반환

"a".repeat(0); // "" 빈문자열 반환

 

(참고)ES6부터 String 타입에 추가된 메서드다.

 

 

2. Array.prototype.join()  활용

:  Array(n+1).join("문자열) => "문자열을 n번 반복 연결한 문자열 반환

  * n은 반복할 횟수(반복할 횟수보다 1을 크게 넣어줘야함)

 

Array(5).join("a");  // "aaaa" 반환

Array(5).join("abc"); // "abcabcabcabc" 반환

원래  join("구분자") 메서드는,

배열 모든 요소들을 "구분자"로 연결한 문자열을 반환하는 메서드다.

[1, 2, 3].join("-") => "1-2-3"

 

이게 작동하는 원리는 다음과 같다.

1. Array(5)                 => length가 5인 배열 생성 (new Array(5) 와 동일)

2. Array(5).join("a")   => 비어있는(?) 요소 5개를 "a"로 이어붙인 문자열 반환.

결과적으로 배열의 5개 요소 사이를 이어붙인 "a"만 4개가 남는다.

=> ""a""a""a""a""

 

5개의 요소를 이어붙이면 구분자가 4개만 사용된다.

그래서 문자열을 반복할 횟수에 1을 더한 값을 인자로 넣어줘야 한다.

 

참고1)  join() 메서드에 인자를 넣지 않으면, 콤마( , )로 연결하여 이어붙인다.

참고2) Array(5)의 요소들은 빈값이라기 보단, undefined 라고 보는게 나을듯 하다.

댓글