Ascending Repeated Inverted Triangle in JavaScript
What You’ll Learn
How to print an ascending repeated number inverted triangle in JavaScript where values increase from 1 to rows while row width decreases.
This pattern clearly shows how changing the inner-loop start point controls row length.
⭐ Pattern Output
For rows = 5, the pattern looks like this:
11111
2222
333
44
5Complete JavaScript Program
Outer loop increases i from 1 to rows. Inner loop runs from i to rows, so output width shrinks each row.
const rows = 5;
for (let i = 1; i <= rows; i++) {
let line = "";
for (let j = i; j <= rows; j++) {
line += i;
}
console.log(line);
}🧠 How It Works
Choose row count
const rows = 5; sets the maximum width for the first row.
Outer loop (ascending value)
for (let i = 1; i <= rows; i++) selects row values in ascending order: 1, 2, 3, 4, 5.
Inner loop (decreasing width)
for (let j = i; j <= rows; j++) prints fewer times as i grows, while line += i; repeats the row value.
Print each row
console.log(line); outputs one line per iteration until row 5 prints just one digit.
Ascending repeated inverted triangle
Total output count is still triangular: n(n+1)/2, so complexity remains 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 = 1; i <= rows; i++) {
for (let j = i; j <= rows; j++) {
document.write(i);
}
document.write("<br>");
}
</script>
</body>
</html>💡 Tips for Enhancement
Try These
- Take
rowsfrom user input to generate custom sizes - Add spaces between digits for improved readability
- Convert this to a full pyramid by combining left and right halves
- Render output in a DOM element instead of using
document.write - Use the same logic with letters for alphabet-pattern practice
Avoid
- Using the wrong inner-loop start (must begin at
i) - Mixing
iandjoutputs unintentionally - Skipping input validation for invalid row values
- Relying on
document.writein production code
Key Takeaways
The outer loop increases row value from 1 to rows.
The inner loop shortens each row by starting from j = i.
Row values increase while row widths decrease.
Loop boundaries are the key to controlling pattern shape.
❓ Frequently Asked Questions
i = 1, inner loop runs from 1 to 5, so it prints 1 five times.i = 5, inner loop runs once (j = 5), so only one 5 is printed.document.write to display output in an HTML page.Explore More JavaScript Number Patterns!
Keep practicing inverted and regular triangle variants to strengthen your loop logic.
This pattern is a nice example where row value increases while width decreases. Opposing loop directions often create visually interesting results.
About the author
12 people found this page helpful