JavaScript Ascending Number Triangle Pattern

Beginner
5 min read
Updated: Sep 2026
3 programs
Live preview

What Is This Pattern?

An ascending number triangle prints digits 1 through i on row i, growing one digit per line.

Remember
Rule: on row i, append 1..i

1
12
123
1234
12345   ← rows = 5

Unlike Program 4 (shrinking descending rows), this pattern grows — total digits for n rows is n(n+1)/2.

How to Solve It

One nested loop: grow the row count, append 1 through i each time. End each row with console.log.

MethodIdeaBest for
Compact digitsAppend j with no spaces (12345)Classic demos
Spaced digitsAppend j + " " (1 2 3 4 5)Easier reading

Pseudocode

Pseudocode
for i from 1 to rows:
    line = ""
    for j from 1 to i:
        append j
    print line

Cheat sheet

GoalPattern
Outer (rows)for (let i = 1; i <= rows; i++)
Inner (digits)for (let j = 1; j <= i; j++)
Append digitline += j;
Spacedline += j + " ";
End the rowconsole.log(line);
Total digitsrows * (rows + 1) / 2

Printing Numbers vs Starting a New Line

APIEffectUse for
line += …Stays on the same rowEach digit j
console.log(line)Ends the current rowAfter j = 1..i finish

Append without a newline, then end the row once.

Live Preview

Change the row count and the ascending triangle updates instantly.

Whole numbers from 1 to 9 (single digits stay neat). Tap a chip or type a value — the preview redraws as you go.

Live result rows = 5 · 15 digits
1
12
123
1234
12345

Worked Walkthrough

Trace three rows — watch how j runs to i and the row grows.

Row ij valuesPrinted row
111
21, 212
31, 2, 3123

Each row has exactly i digits. Total digits for n rows = n(n+1)/2.

JavaScript Programs

Three complete programs: fixed rows = 5, prompt input, and spaced digits. Use View Output for samples, or Try It Yourself to edit and run live.

Example 1 — Fixed rows = 5

Nested loops append digits 1..i with no spaces between them.

JavaScript
const rows = 5;

for (let i = 1; i <= rows; i++) {
  let line = "";
  for (let j = 1; j <= i; j++) {
    line += j;
  }
  console.log(line);
}
Try It Yourself

How It Works

1. Outer loop grows. i runs from 1 to rows — one row per value of i.

2. Inner loop fills the row. j runs from 1 to i; each pass appends the digit j.

3. End the row. console.log(line) after the inner loop starts the next line.

Example 2 — User Input Rows

Read the row count with prompt and validate before drawing.

JavaScript
const rows = parseInt(prompt("Enter 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 = 1; j <= i; j++) {
      line += j;
    }
    console.log(line);
  }
}
Try It Yourself

How It Works

1. Prompt and validate. Use parseInt and require rows >= 1.

2. Same triangle core. Only the source of rows changes — 1..i matches Example 1.

3. Entering 4. Ten digits total (4×5/2), ending at 1234.

Example 3 — Spaced Digits

Same growing triangle; append a space after each digit for easier reading.

JavaScript
const rows = 5;

for (let i = 1; i <= rows; i++) {
  let line = "";
  for (let j = 1; j <= i; j++) {
    line += j + " ";
  }
  console.log(line);
}
Try It Yourself

How It Works

1. Same geometry. Still j = 1..i on each row.

2. Add a space. line += j + " " separates digits — useful when values become multi-digit.

3. Same growth rule. Only the formatting changes — compare with Example 1.

Edge Cases & Pitfalls

Check these before calling the solution done.

log early

Call console.log only after the row is built

Logging inside the inner loop prints one digit per line.

Wrong bound

Inner loop must stop at i

Using j <= rows every row makes a rectangle, not a triangle.

rows = 1

Single-row case

Output is just 1 — one digit on one line.

Bad input

Validate parseInt

Check Number.isFinite(rows) and require rows >= 1 before the loops.

Time and Space Complexity

ProgramTimeExtra space
Fixed / spaced (Examples 1, 3)O(n²)O(n) per row string
User input (Example 2)O(n²)O(n) per row string

Digits appended are 1 + 2 + … + n = n(n+1)/2 — quadratic in n.

Key Takeaways

  • Rule: on row i, append digits 1 through i.
  • Grow: outer loop counts up so each row is one digit longer.
  • Break the row: call console.log(line) only after the digit loop.
  • Complexity: O(n²) — total digits = n(n+1)/2.

One line: nest two loops, append 1..i on each growing row, then log the line.

Frequently Asked Questions

The outer loop runs i from 1 to rows. For each row i, the inner loop runs j from 1 to i and appends j. Row 1 prints 1, row 2 prints 12, and so on.
The outer loop counts up and the inner bound equals i. When i increases, each row prints one more digit than the previous row.
line += appends on the same row. console.log(line) ends the row after digits 1..i finish.
Program 4 prints rows..i in descending order (54321, 5432, …). Program 5 prints 1..i in ascending order — a growing triangle instead of a shrinking one.
Replace 5 with rows in the outer loop bound — see Example 2.
Count the outer loop down: for (let i = rows; i >= 1; i--). Keep the inner loop as for (let j = 1; j <= i; j++) — that is Program 1.
O(n²) for n rows because total appends are 1+2+…+n = n(n+1)/2.
Only one row prints — a single digit 1 on one line.

Did you know?

Row i appends digits 1 through i. The outer loop counts up from 1 to rows, so each row grows by one digit — total appends = n(n+1)/2.

Next: Reverse Ascending Number Triangle

Continue with the next pattern in the JavaScript number-pattern series.

Program 6 tutorial →

About the author

Mari Selvan M P
Mari Selvan M P 🔗

Developer, cloud engineer, and technical writer

  • Experience 12 years building web and cloud systems
  • Focus Full Stack Development, AWS, and Developer Education

I write practical tutorials so students and working developers can learn by doing—from databases and APIs to deployment on AWS.

12 people found this page helpful