JavaScript ピラミッドのアルゴリズムの問題

実現したいこと

javascriptで、
入力された数値を使って
ピラミットの形を出力したいです。

前提

入力された数値の分だけ高さのあるピラミッドを出力したいです。
XXOXX
XOOOX
OOOOO
例:3と入力されたら上記のような形にしたい。

発生している問題・エラーメッセージ

現在はfor文を二つとif文を一つ使って書いており出力もできてはいるのですが、希望の形になっていません。
現在のコードだと、3と入力した際
XXOOO
XOOOO
OOOOO
このような形になってしまいます。
ただ、コードの"height"となっている部分を3など直接数字に書き変えると希望の出力になります。
console.logで"height"に入力された数字が取得できていることは確認しています。

該当のソースコード

Javascript

1<body>2 <label for="height">ピラミッドの高さ:</label>3 <input type="number" id="height" name="height" required min="1">4 <button id="generateButton">生成</button>5 <br><br>6 <pre id="pyramid"></pre>7 8 <script>9 let button = document.getElementById("generateButton");10 let pyramid = document.getElementById("pyramid");11 12 button.addEventListener("click", function() {13 let iremono = "";14 15 let height = document.getElementById("height").value;16 17    /*縦の列の制御*/18 for (let i = 0; i < height; i++) {19      /*横の列の制御*/20 for (let j = 0; j < height * 2 - 1; j++) {21 let num1 = height - i - 1;22 let num2 = height + i - 1;23 let str = "";24 if (j >= num1 && num2 >= j) {25 str += "*";26 } else {27 str += "_";28 }29 iremono += str;30 }31 iremono += "<br>";32 }33 pyramid.innerHTML = iremono;34 });35 </script>36</body>

コメントを投稿

0 コメント