JavaScript Descending Number Triangle Pattern (Right-Aligned)
Beginner
5 min read
Updated: Sep 2026
3 programs
Live preview
Definition
What Is This Pattern?
A right-aligned descending number triangle prints digits i..1 on each row, padded with leading spaces so every row shares the same width and the digits sit on the right.
Remember
Rule: for i = 1..rows
for j = rows..1
print space if j > i else j
1
21
321
4321
54321 ← rows = 5
Natural step after left-aligned reverse triangles — once fixed-width loops and line += / console.log click, other padded patterns get easier.
Approach
How to Solve It
Grow the digit count with the outer loop; keep the inner loop fixed-width and choose space or digit.
Method
Idea
Best for
Nested loops + if/else
Outer i = 1..rows; inner j = rows..1
Learning, interviews
prompt + ternary
Same loops; compact (j > i) ? " " : j
Interactive practice
Browser <pre>
Build text, write once inside <pre>
Quick HTML demos
Pseudocode
Pseudocode
for i from 1 to rows:
line = ""
for j from rows down to 1:
if j > i:
line += " "
else:
line += j
print line (with newline)
Cheat sheet
Goal
Pattern
Set size
const rows = 5;
Outer loop
for (let i = 1; i <= rows; i++)
Inner loop
for (let j = rows; j >= 1; j--)
Space or digit
if (j > i) line += " "; else line += j;
Ternary form
line += (j > i) ? " " : j;
End row
console.log(line);
Printing Numbers vs Starting a New Line
API
Effect
Use for
line += " " / line += j
Stays on the same row
Each column
console.log(line)
Ends the line
After the inner loop
Build the row with +=, then break once with console.log. Putting console.log inside the inner loop prints one character per line.
Try it
Live Preview
Change rows and the right-aligned descending triangle updates instantly.
Whole numbers from 1 to 9. Tap a chip or type a value — the preview redraws as you go.
Live resultrows = 5 · chars = 25
1
21
321
4321
54321
Trace
Worked Walkthrough — rows = 4
Trace each outer value of i, count leading spaces, and read the digits on that row.
i
Spaces
Digits
Printed row
1
3
1
1
2
2
21
21
3
1
321
321
4
0
4321
4321
Each row prints exactly rows characters — total work is O(n²) for n rows.
Code
JavaScript Programs
Three complete programs: fixed rows = 5, prompt input with ternary, and a browser <pre> version. Use View Output for sample results, or Try It Yourself to edit and run in the playground.
Example 1 — Fixed rows = 5
Hard-coded width — if/else chooses space or digit in one fixed-width descending loop.
JavaScript
const rows = 5;
for (let i = 1; i <= rows; i++) {
let line = "";
for (let j = rows; j >= 1; j--) {
if (j > i) {
line += " ";
} else {
line += j;
}
}
console.log(line);
}
1. Outer loop grows.i runs from 1 to rows — one right-aligned row per iteration.
2. Inner loop is fixed-width.j always runs from rows down to 1, so every row has the same length.
3. Space or digit. Append a space while j > i; otherwise append j. When i = 3 you get two spaces + 321.
Example 2 — prompt Input
Read rows at runtime. Ternary replaces if/else; the inner loop uses rows as width.
JavaScript
const rows = parseInt(prompt("Enter the number of rows:"), 10);
if (!Number.isFinite(rows) || rows < 1) {
console.log("Please enter a positive integer.");
} else {
for (let i = 1; i <= rows; i++) {
let line = "";
for (let j = rows; j >= 1; j--) {
line += (j > i) ? " " : j;
}
console.log(line);
}
}
1. Same loops. Outer 1..rows, inner rows..1 — identical to Example 1.
2. Build a string. Append each finished row plus "\n" into out.
3. Preserve spaces. Wrapping in <pre> keeps leading spaces aligned without any CSS.
Edge Cases & Pitfalls
Check these before calling the solution done.
log inside
Vertical characters
If console.log is inside the inner loop, each space or digit lands on its own line. Append with +=; log only after the inner loop.
Ascending j
Wrong digit order
Counting j up from 1 prints ascending digits. Keep j = rows..1 so each row ends with i..1.
Reuse line
Growing leftovers
Reset line = "" at the start of each outer iteration, or characters from previous rows stick around.
HTML spaces
Collapsed padding
Plain document.write(line) collapses leading spaces in HTML. Use <pre> (Example 3) or console.log.
rows = 1
Single digit
Output is just 1 on one line — no leading spaces.
NaN input
Validate parseInt
Letters or empty prompt yield NaN — check Number.isFinite(rows) && rows >= 1.
Analysis
Time and Space Complexity
Program
Time
Extra space
Examples 1–2
O(n²)
O(n) for the current line string
Browser <pre> (Example 3)
O(n²)
O(n²) to hold the full output string
Every row prints exactly n characters → total n × n appends → O(n²).
Remember
Key Takeaways
Rule: for j = rows..1, append space if j > i else j.
Fixed width: the inner loop always runs rows times so columns stay aligned.
Write vs log:line += builds; console.log(line) breaks.
Complexity:O(n²) for n rows.
One line: for j = rows..1, print space if j > i else j, then log the line.
Frequently Asked Questions
The inner loop always runs rows times. While j > i it appends a space; otherwise it appends j. Smaller rows get more leading spaces, so digits sit on the right.
j counts from rows down to 1. When j <= i the digit j is appended, so each row ends with i..1.
line += appends a space or digit on the same row. console.log(line) prints the finished row and starts a new line.
Program 3 is a left-aligned reverse descending triangle with no leading spaces. Program 30 pads with spaces so every row has the same width.
O(n²) for n rows. Every row runs a fixed-width inner loop of n iterations, so total work is n × n.
Yes. line += (j > i) ? " " : j is the compact form shown in Example 2.
Use parseInt(prompt(...), 10) and check Number.isFinite(rows) && rows >= 1 so bad input does not produce NaN.
One row prints with no leading spaces — just 1.
🤔
Did you know?
Each row is exactly rows characters wide. While j > i you append a space; otherwise you append j. That fixed-width inner loop is what keeps the triangle right-aligned — still O(n²).
