JavaScript Alphabet Triangle Pattern (Right-Angled)

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

What Is This Pattern?

An alphabet right-angled triangle prints a left-aligned staircase of letters: row i is the first i letters of the alphabet.

Remember
Rule: on row i, print A through the i-th letter

A
AB
ABC
ABCD
ABCDE     ← 5 rows

In JavaScript you solve it with two nested for loops: the outer loop picks the row, the inner loop appends letters with String.fromCharCode, then console.log(line) moves to the next line. Once this clicks, reverse triangles and other letter patterns become much easier.

How to Solve It

Two ways to emit the same shape — start with nested charCodeAt loops, then optionally shorten with slice.

MethodIdeaBest for
Nested loopsOuter = rows; inner appends letters via fromCharCodeLearning, interviews, exams
letters.slice(0, i)Take the first i letters of A–Z in one callShorter demos once loops click

Pseudocode

Pseudocode
start = code of 'A'
for i from 1 to rows:
    line = ""
    for code from start to start + i - 1:
        append fromCharCode(code) to line
    print line

Cheat sheet

GoalPattern
Walk each rowfor (let i = 1; i <= rows; i++)
Start codeconst start = "A".charCodeAt(0);
Append i lettersfor (let code = start; code < start + i; code++) line += String.fromCharCode(code);
End the rowconsole.log(line);
One-line row shortcutconsole.log(letters.slice(0, i));
Reverse laterCount down from the top letter → Program 2

Printing Letters vs Starting a New Line

APIEffectUse for
line += chStays on the same rowEach letter
console.log(line)Ends the current rowAfter the inner loop

Append letters without a newline, then end the row once.

Live Preview

Change the row count and the alphabet triangle updates instantly — including the triangular letter total.

Whole numbers from 1 to 10. Tap a chip or type a value — the preview redraws as you go.

Live result 5 rows · last E · 15 letters
A
AB
ABC
ABCD
ABCDE

Worked Walkthrough — rows = 4

Trace each outer-loop value of i and the letters appended on that row.

iCodesPrinted rowLetters
1AA1
2A..BAB2
3A..CABC3
4A..DABCD4

Total letter characters: 1 + 2 + 3 + 4 = 10 = 4×5/2. That triangular sum is why time is O(n²).

JavaScript Programs

Three complete programs: fixed rows, prompt input, and a slice shortcut. Use View Output for sample results, or Try It Yourself to edit and run in the playground.

Example 1 — Fixed rows = 5

Hard-coded height — ideal for first demos and screenshots.

JavaScript
let rows = 5;
const start = "A".charCodeAt(0);

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

How It Works

1. Set height and start code. rows = 5; start is the code point of A.

2. Outer loop picks the row. i runs from 1 to rows. Start each row with an empty line.

3. Inner loop appends letters. code runs from start through start + i - 1, so row i gets exactly i letters.

4. Break the line. console.log(line) after the inner loop prints the row and starts the next one.

When i = 1 you get A; when i = 3 you get ABC; and so on up to ABCDE.

Example 2 — User Input Version

Read the row count at runtime with prompt. Validate with parseInt and clamp to 26 for A–Z demos.

JavaScript
let rows = parseInt(prompt("Enter the number of rows:"), 10);
const start = "A".charCodeAt(0);

if (!Number.isFinite(rows) || rows < 1) {
  console.log("Please enter a whole number of rows >= 1.");
} else {
  if (rows > 26) rows = 26;

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

How It Works

1. Prompt and parse. Ask for a row count, then convert with parseInt(..., 10).

2. Validate and clamp. Reject NaN or non-positive values; cap at 26 so codes stay in A–Z.

3. Same nested-loop core. Only the source of rows changes — the print logic matches Example 1.

Example 3 — letters.slice(0, i)

Take the first i letters of A–Z in one call — same shape, no explicit inner letter loop.

JavaScript
let rows = 5;
const letters = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";

for (let i = 1; i <= rows; i++) {
  console.log(letters.slice(0, i));
}
Try It Yourself

How It Works

1. One outer loop. Still walk i from 1 to rows.

2. Build the row. letters.slice(0, i) returns the first i characters of the alphabet string.

3. Print and advance. console.log prints that string and ends the line.

Learn the two-loop version first (Examples 1–2) so you can explain both bounds; treat this as a polish shortcut afterward.

Edge Cases & Pitfalls

Check these before calling the solution done.

log inside

Column of letters

If console.log is inside the inner loop, each letter lands on its own line. Append with +=; call console.log only after the inner loop.

Reuse line

Growing leftovers

Reset line = "" at the start of each outer iteration, or letters from previous rows stick around.

Wrong bound

Rectangle / wrong length

Inner range must be start through start + i - 1. A fixed end always prints the same width.

rows = 1

Single A

Output is just A on one line — a good sanity check.

rows > 26

Beyond Z

Clamp or reject — codes leave A–Z. Keep rows in 1…26 for alphabet demos.

Bad prompt

Use Number.isFinite

Bare parseInt(prompt()) yields NaN on letters — validate before the outer loop.

Time and Space Complexity

ProgramTimeExtra space
Nested loops (Examples 1–2)O(n²)O(n) for the current line string
letters.slice(0, i) (Example 3)O(n²)O(n) per temporary row string

Total letters logged = 1 + 2 + … + n = n(n+1)/2, which is still quadratic in n.

Key Takeaways

  • Rule: row i prints letters A through the i-th letter.
  • Two loops: outer = rows; inner appends with fromCharCode.
  • Break the row: call console.log(line) only after the inner loop.
  • Complexity: O(n²) time from the triangular letter count.

One line: for each row i, append A through the i-th letter, then console.log.

Frequently Asked Questions

The outer loop picks the row length. The inner loop walks letter codes from "A".charCodeAt(0) through that many characters, so row 1 is A, row 2 is AB, row 3 is ABC, and so on.
Each row is a fresh sequence from A to the current end letter. If you kept advancing a single char across rows, you would get a different pattern (not this right-angled alphabet triangle).
line += String.fromCharCode(code) stays on the same row. console.log(line) ends the row after the inner loop finishes.
Start each row at the top letter and count down — for example E, ED, EDC. See Alphabet Pattern Program 2.
O(n²) where n is the number of rows. Total logged characters equal 1+2+…+n = n(n+1)/2.
Yes. Keep a string of A–Z and console.log(letters.slice(0, i)) for row length i. Nested charCodeAt/fromCharCode loops are better for learning; slicing is a handy shortcut later.
Use parseInt(prompt(...), 10), check Number.isFinite(rows), and clamp between 1 and 26 so letter codes stay within A–Z.
Letter codes can produce characters beyond Z. Clamp to 26 for A–Z demos, or define a clear wrap/error policy.

Did you know?

Row i logs letters from A through the i-th letter (A, AB, ABC, …). Total letters for n rows is the triangular number n(n+1)/2 — the same count that makes this pattern O(n²).

Next: Reverse Alphabet Triangle

Start each row at the top letter and count down — E, ED, EDC, EDCB…

Program 2 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