Reverse-Start Ascending Number Triangle in JavaScript
What You’ll Learn
How to print a reverse-start ascending number triangle in JavaScript using nested loops. Each next row starts with a smaller number and extends to rows.
This pattern demonstrates how changing the inner loop start creates a left-growing sequence.
⭐ Pattern Output
For rows = 5, the pattern looks like this:
5
45
345
2345
12345Complete JavaScript Program
Outer loop decreases from rows to 1. Inner loop prints from the current row value up to rows.
const rows = 5;
for (let i = rows; i >= 1; i--) {
let line = "";
for (let j = i; j <= rows; j++) {
line += j;
}
console.log(line);
}🧠 How It Works
Set rows value
const rows = 5; sets the maximum number and number of rows.
Outer loop (rows down)
for (let i = rows; i >= 1; i--) lowers starting number each row.
Inner loop (print i..rows)
for (let j = i; j <= rows; j++) prints values from current start to max value.
Print line output
console.log(line); outputs each generated row.
Reverse-start ascending triangle
Total printed numbers still sum to n(n+1)/2, so runtime is O(n²).
Variation — Browser (document.write) Version
Print the same pattern directly in an HTML page using document.write:
<!DOCTYPE html>
<html>
<body>
<script>
const rows = 5;
for (let i = rows; i >= 1; i--) {
for (let j = i; j <= rows; j++) {
document.write(j);
}
document.write("<br>");
}
</script>
</body>
</html>💡 Tips for Enhancement
Try These
- Validate row input before printing pattern output
- Add spaces between numbers for cleaner display
- Try
rows = 7to observe the same growth behavior - Convert logic into a reusable function
- Render output in a
<pre>element using DOM APIs
Avoid
- Using incorrect inner loop direction for this pattern style
- Forgetting newline output after each row
- Mixing loop boundaries (
ivsrows) accidentally - Depending on
document.writefor production pages
Key Takeaways
The outer loop decreases the start value from rows to 1.
The inner loop prints from i up to rows.
Rows grow in length while their first value decreases.
Changing loop starts/ends is the key to building new number patterns.
❓ Frequently Asked Questions
i = rows, so inner loop runs once from j = 5 to 5.i = 2, inner loop runs from 2 to 5, producing 2345.console.log(line), which is cleaner for coding practice.n(n+1)/2.Explore More JavaScript Number Patterns!
Experiment with loop boundaries and directions to build faster intuition for pattern programming.
Pattern programs often differ by just one loop boundary. Tiny loop edits can transform output completely, which makes them excellent for mastering nested loops.
About the author
12 people found this page helpful