JavaScript / repeat()로 문자열 반복하기와 횟수 제한

String.prototype.repeat()는 원본 문자열을 지정한 횟수만큼 이어 붙인 새 문자열을 반환합니다. 예를 들어 "abc".repeat(2)는 "abcabc"입니다. 원본 문자열은 바뀌지 않으며, 횟수가 0이면 빈 문자열이 나옵니다.

기본 문법과 반환값

text.repeat(count)처럼 문자열 값에서 호출합니다. count는 복사할 횟수이며 반환값은 항상 새 문자열입니다. 문자열 사이에 구분 문자가 필요하면 반복할 조각 안에 그 문자를 포함하거나 배열의 join()을 사용하는 편이 명확합니다.

const text = 'abc';
console.log(text.repeat(0)); // ''
console.log(text.repeat(2)); // 'abcabc'
console.log(text); // 'abc': 원본 유지
console.log('-'.repeat(5)); // '-----' 

숫자가 정수가 아니면 정수로 변환한 횟수만큼 반복합니다. 따라서 "ab".repeat(2.9)의 결과는 "abab"입니다. 호출할 때에는 이런 암묵적 변환에 의존하기보다 정수를 명시적으로 전달하는 것이 읽기 쉽습니다.

잘못된 횟수와 긴 결과 처리

음수나 무한대는 RangeError를 발생시킵니다. 결과 문자열이 구현 환경의 최대 길이를 넘을 때도 오류가 날 수 있습니다. 외부 입력으로 긴 문자열을 만들 수 있는 화면이라면 반복 횟수와 결과 길이를 별도로 제한해야 합니다.

console.log('ab'.repeat(2.9)); // 'abab'
try {
  'ab'.repeat(-1);
} catch (error) {
  console.log(error.name); // 'RangeError'
}

브라우저 입력의 type="number"만으로는 실행 시의 유효성이 보장되지 않습니다. JavaScript에서도 정수 여부와 허용 범위를 확인하세요. MDN의 String.repeat() 문서에 변환 규칙과 오류 조건이 정리되어 있습니다.

전체 예제: 입력한 문자열 반복하기

다음 코드를 string-repeat.html에 저장하고 브라우저에서 엽니다. 문자열과 반복 횟수를 입력해 버튼을 누르면 결과와 문자열 길이를 보여 줍니다. 예제에서는 화면에 너무 긴 결과가 표시되지 않도록 횟수를 0~20의 정수로 제한합니다.

<!doctype html>
<html lang="ko">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>String.repeat 반복 횟수 실습</title>
</head>
<body>
<label for="word">반복할 문자열</label>
<input id="word" value="abc">
<label for="count">반복 횟수 (0~20)</label>
<input id="count" type="number" min="0" max="20" step="1" value="2">
<button id="run" type="button">반복하기</button>
<pre id="result" aria-live="polite"></pre>
<script>
const word = document.querySelector('#word');
const count = document.querySelector('#count');
const result = document.querySelector('#result');

function update() {
  const times = Number(count.value);
  if (!Number.isInteger(times) || times < 0 || times > 20) {
    result.textContent = '횟수는 0~20의 정수로 입력하세요.';
    return;
  }
  const repeated = word.value.repeat(times);
  result.textContent = `결과: ${JSON.stringify(repeated)}\n` +
    `문자열 길이: ${repeated.length}`;
}

document.querySelector('#run').addEventListener('click', update);
update();
</script>
</body>
</html>

기본값 abc와 2의 결과는 "abcabc", 길이는 6입니다. 횟수를 0으로 바꾸면 결과가 빈 문자열이고 길이는 0입니다. 소수나 음수, 21 이상을 넣으면 안내 문구가 표시됩니다. 문자열 내용 자체가 매우 길다면 이 예제의 20회 제한도 충분하지 않을 수 있으므로 실제 서비스에서는 입력 길이까지 제한하세요.