例題(レベル別) — String.prototype.repeat() 練習セット
以下は初心者〜上級向けに分けた練習問題集です。各問題に「ヒント」「解答」「解説」を付けています。まずは自分で考えてから解答を見るのがおすすめ!
初級(基本の理解)
問1
'Hi'.repeat(4) の出力は何ですか?
ヒント: 文字列をそのまま繰り返します。
答: "HiHiHiHi"
解説: 'Hi' を4回つなげた文字列が返る。元の文字列はそのまま。
問2
'★'.repeat(0) の出力は?
ヒント: 回数が 0 の場合。
答: ""(空文字)
解説: 回数 0 は空文字を返します。
問3
'abc'.repeat(2 + 1) の出力は?(まず計算してみてください)
ヒント: 2 + 1 は演算されます。
答: "abcabcabc"
解説: 2 + 1 が 3 になり、'abc' が 3 回繰り返される。
問4
次のコードの出力は?(エラーになるかも考えて)
console.log('x'.repeat(-1));
JavaScriptヒント: repeat の回数は負にならないか?
答: RangeError(エラー)
解説: 回数が負だと RangeError が投げられる。事前に値をチェックする必要がある。
中級(実用例・操作)
問5
ユーザー名を右側にスペースで埋めて幅 10 に揃えるコードを書いてください(name の長さが 10 以上ならそのまま表示)。
ヒント: スペース ' ' を repeat で使う。
模範解答
function padRight(name) {
const width = 10;
const padCount = Math.max(0, width - name.length);
return name + ' '.repeat(padCount);
}
console.log("'" + padRight('Bob') + "'"); // 'Bob '
JavaScript解説: 必要なスペース数を計算して repeat。負にならないよう Math.max(0, ...)。
問6
文字列 s の長さだけ * を並べる mask を作る関数を作ってください。
模範解答
function makeMask(s) {
return '*'.repeat(s.length);
}
console.log(makeMask('secret')); // "******"
JavaScript解説: s.length は 0 以上なのでそのまま repeat に使える。
問7
ユーザーが入力した回数 n に対して 'A' を繰り返すが、n が小数や負になった場合に安全に処理するコードを書いてください(小数は切り捨て、負は 0 とする)。
模範解答
function safeRepeatA(n) {
const count = Math.max(0, Math.floor(Number(n) || 0));
return 'A'.repeat(count);
}
console.log(safeRepeatA('3.9')); // "AAA"
console.log(safeRepeatA(-2)); // ""
JavaScript解説: Number() で数値化し、Math.floor で小数切り捨て、Math.max(0, ...) で負を防ぐ。
上級(注意点・応用)
問8
次のコードの出力は?(注意深く考えてください)
console.log('ab'.repeat(1.9));
console.log('ab'.repeat(NaN));
JavaScriptヒント: 小数と NaN の扱い。
答:
'ab'.repeat(1.9)→"abab"'ab'.repeat(NaN)→""(空文字)
解説: repeat に渡された小数は内部で整数に変換(切り捨て)されるため 1.9 は 1 ではなく 実際には 1? —ここで注意:ECMAScript の仕様では repeat は引数を ToIntegerOrInfinity に変換します。実装の多くは小数を切り捨てて使うので 1.9 は 1 相当。しかしブラウザ差が心配な場合は Math.floor してから渡すのが確実です。NaN は 0 と同様に扱われ、空文字が返ります。
(※ 実行環境により厳密な振る舞いを確認したい場合は、自分のブラウザ/Node で試してみてください。)
問9
非常に大きな回数を渡すとどうなる可能性がありますか?安全対策を1つ挙げてください。
答: 実行時にメモリ不足や性能問題でクラッシュする、または RangeError が出ることがある。対策: 最大回数に上限を設ける(例:Math.min(count, 1_000_000))や入力を検証する。
解説: 実際に数百万〜数千万文字を生成すると環境によっては危険。生成前に上限チェックを入れること。
問10(実践・やや挑戦)
以下を満たす関数 frame(text, widthChar) を作ってください。
text(短い文字列)を中央寄せして左右をwidthChar(例:'=')で埋める- 出力の総幅は
text.length + 10(左右に合計10文字の装飾)とする。 textが長すぎる場合はそのまま返す(装飾なし)。
模範解答
function frame(text, widthChar) {
const totalWidth = text.length + 10;
const paddingTotal = totalWidth - text.length; // =10
if (paddingTotal <= 0) return text;
const left = Math.floor(paddingTotal / 2);
const right = paddingTotal - left;
return widthChar.repeat(left) + text + widthChar.repeat(right);
}
console.log(frame('Hello', '=')); // "=====Hello====="
JavaScript解説: 左右のパディングを計算して repeat で作る。Math.floor で中央寄せの微調整。
自主学習用ヒント集
- 実行して確かめる:コンソール(ブラウザの DevTools)や Node.js でコードを試す習慣をつける。
- 入力は必ず検証:ユーザー入力を直接
repeatに渡す前にNumber()・Math.floor・Math.max等で整える。 - 大きな数は要注意:上限を設けておく。
- 見た目の装飾に便利:
'*'.repeat(n)や' '.repeat(n)は標準出力やログ表示の整形で役立つ。
