Triangle with Reverse Starting Letter in JavaScript

Beginner
⏱️ 8 min read
📚 Updated: Aug 2026
🎯 3 Code Examples
🚀 Live Preview
Nested Loops

What You’ll Learn

Print an alphabet triangle where each row starts one letter earlier, but letters still run forward to a fixed top — E, DE, CDE, BCDE, ABCDE. Mixes ideas from Program 1 (forward run) and Program 2 (moving start). Includes a live preview, worked JavaScript examples, edge cases, and complexity.

Shape Rule

Growing forward rows

Row k prints k letters ending at the fixed top.

Outer Loop

Row start letter

for (let code = top; code >= base; code--) picks the first letter.

Inner Loop

Forward to top

j starts at i and prints up to top.

Fixed Right Edge

Always top

Every row ends at E (or your chosen top).

Live Preview

1–10 rows

Pick a height and draw the triangle instantly.

O(n²)

Complexity

Triangular letter count: n(n+1)/2 writes.

Introduction

An alphabet triangle with reverse starting letter grows like Programs 1 and 2, but the first letter of each row moves backward while letters along the row still increase forward to a fixed top.

In JavaScript you solve it with nested for loops and charCodeAt/fromCharCode: the outer loop walks the start code from top down to A, and the inner loop appends from that start up to top.

Why it matters?

It trains mixing a descending outer bound with an ascending inner loop — a common combo in aligned suffixes, diagonals, and later pyramid patterns.

Key Highlights

Growing Rows

1, 2, 3, … letters per row.

Start Moves Back

Outer loop: E, D, C, …

Forward Letters

Inner loop uses for (let j = code; j <= top; j++).

Fixed Right Edge

Every row ends at top.

In short: for each start letter i from top down to A, append i..top, then call console.log(line).

📝 Problem & Approach

Given a row count n (or fixed A–E), print a left-aligned triangle of forward alphabet suffixes ending at a fixed top.

JavaScript
// Five rows (top = E)
# E
# DE
# CDE
# BCDE
# ABCDE

Inputs & Outputs

ItemTypeDescription
rows / topint / charNumber of rows, or top letter where top = "A".charCodeAt(0) + rows - 1.
Printed outputtextGrowing forward suffixes ending at top on every row.

Minimal workflow

Pseudocode
top = "A".charCodeAt(0) + rows - 1
for i from top down to base:      // start letter
    line = ""
    for j from i up to top:      // forward run
        line += String.fromCharCode(j)
    console.log(line)

Approach comparison

ApproachIdeaBest for
Outer down, inner upStart moves back; letters run forwardMatching this classic sample
Substring of A..topTake trailing slice of length kShortcut after you understand the loops

⚡ Quick Reference

GoalPattern
Top lettertop = "A".charCodeAt(0) + rows - 1
Outer (start letter)for (let code = top; code >= base; code--)
Inner (append)for (let j = code; j <= top; j++) line += String.fromCharCode(j)
End the rowconsole.log(line)
Descending along rowSee Program 2
LowercaseUse 'a' as the base instead of 'A'

📋 Prog 1 vs Prog 2 vs Prog 3

Same growing triangle - different start and letter direction.

Program 1
A..i

Always starts at A; end grows

Program 2
top..i

Always starts at top; letters descend

Program 3
i..top

Start moves back; letters ascend

console.log
break

Ends the row after i..top finishes

Context

When This Pattern Shows Up

Reach for this when teaching a descending start bound with a forward letter run.

  1. After Programs 1 & 2

    Keep the triangle; mix reverse start with forward letters.

  2. Fixed right-edge drills

    Practice suffixes that always end at the same letter.

  3. Bridge to Program 4

    Next flips direction again: A, BA, CBA, …

  4. Char arithmetic practice

    Mix a descending outer code-- loop with an ascending inner j++ loop.

  5. Not a UI layout tool

    This is a console teaching pattern — not how you build modern app screens.

Key benefit: one descending start plus a forward inner loop is the cleanest way to keep a fixed right edge while rows grow.

🔮 Live Preview

Choose 1–10 rows and draw the reverse-starting-letter alphabet triangle in the browser.

Try 5 (classic E…ABCDE) or 4 (D…ABCD). Max 10 keeps the preview readable.

Live result
Press "Draw pattern".

Examples Gallery

Three complete JavaScript programs - fixed A–E, user-chosen row count, and a spaced-letter variant. Click View Output to reveal sample console results, or Try it Yourself to run in the browser editor.

📚 Getting Started

Print five rows with a moving start and a forward letter run.

Example 1 — Fixed Top E

Outer loop chooses the first letter on the row; inner loop appends forward up to 'E'.

JavaScript
const top = "E".charCodeAt(0);
const base = "A".charCodeAt(0);

for (let code = top; code >= base; code--) {
  let line = "";
  for (let j = code; j <= top; j++) {
    line += String.fromCharCode(j);
  }
  console.log(line);
}
Try it Yourself

How It Works

When code is 'C', the inner loop appends C, D, ECDE. When code is 'A', it appends the full forward run ABCDE.

📈 Practical Variant

Let the user choose how many rows to print.

Example 2 — Row Count Input

Read the number of rows and compute top = "A".charCodeAt(0) + rows - 1. Validate parseInt(prompt()) with Number.isFinite and clamp rows in real apps.

JavaScript
let rows = parseInt(prompt("Enter the number of rows:"), 10);
if (!Number.isFinite(rows)) {
  console.log("Please enter a whole number.");
} else {
  rows = Math.max(1, Math.min(rows, 26));
  const base = "A".charCodeAt(0);
  const top = base + rows - 1;

  for (let code = top; code >= base; code--) {
    let line = "";
    for (let j = code; j <= top; j++) {
      line += String.fromCharCode(j);
    }
    console.log(line);
  }
}
Try it Yourself

How It Works

For 4 rows, top becomes 'D'. Cap rows at 26 so top stays within A–Z.

⚡ Readability Variant

Same triangle with spaces between letters.

Example 3 — Spaced Letters

Append a trailing space after each letter so columns are easier to scan.

JavaScript
const top = "E".charCodeAt(0);
const base = "A".charCodeAt(0);

for (let code = top; code >= base; code--) {
  let line = "";
  for (let j = code; j <= top; j++) {
    line += String.fromCharCode(j) + " ";
  }
  console.log(line);
}
Try it Yourself

How It Works

Same start/forward logic; only the append format adds a trailing space after each letter.

🧠 How the Algorithm Prints Rows

1

Outer loop: move the start

i runs from top down to 'A'. That makes each row start one letter earlier.

Row start
2

Inner loop: print forward

For each row, j runs from i up to top. So row i prints i, i+1, ..., top.

Letters
3

New line

console.log(line) ends the row and moves to the next line.

Line break
4

Right edge stays fixed

Because the inner loop always stops at top, every row ends on the same letter while the left side grows.

Alignment
=

Reverse start, forward run

Total printed characters are 1+2+…+n, so time complexity is O(n²).

🔎 Worked Walkthrough — Top = E (5 rows)

Trace each start letter and the resulting forward suffix.

i (start)Inner rangePrinted row
EE..EE
DD..EDE
CC..ECDE
BB..EBCDE
AA..EABCDE

Row lengths are 1, 2, 3, 4, 5. The right edge is always E.

Use Cases

Where this reverse-start forward triangle shows up beyond the homework prompt.

1. Mixed-Direction Labs

Clearest demo of a descending outer loop with a forward inner range in one program.

Example: flip the inner loop to count down and land on Program 2.

2. Fixed Right Edge

Practice suffixes that always end at the same letter.

Example: change top to H and watch every row end at H.

3. Compare Series

Contrast with Programs 1 and 2 side by side.

Example: same 5 rows, three different letter stories.

4. Spaced Output

Add separators without changing loop structure (Example 3).

Example: print j + " " for easier scanning.

5. Complexity Intuition

Triangular counts make O(n²) easy to see.

Example: 5 rows print 15 letters total.

6. Bridge to Program 4

Next prints reverse-order rows: A, BA, CBA, …

Example: continue to Program 4.

Pro Tip: say “start moves back, letters run forward to top” before coding - that story prevents accidentally writing Program 2’s j--.

Advantages

Why this pattern earns a spot between Programs 2 and 4.

  1. 1. Instant Visual Feedback

    A wrong inner direction shows up as Program 2’s shape.

  2. 2. Teaches Mixed Directions

    Outer descends; inner ascends — both in one file.

  3. 3. Scales Cleanly

    Change rows / top and the whole triangle grows.

  4. 4. Clear Right Alignment Story

    Fixed end letter makes the suffix idea easy to explain.

Pro Tip: learn the compact line += String.fromCharCode(j) version first; add spaces only when you need readable columns.

Usage Tips

Small habits that keep reverse-start triangles clean.

  1. 1. Increment the Inner Loop

    Use j++ from i to top — not j--.

  2. 2. Set top from Rows

    Use top = "A".charCodeAt(0) + rows - 1 so scaling stays automatic.

  3. 3. Cap Rows at 26

    Keep top within A–Z for demos.

  4. 4. Wrap parseInt(prompt(), 10) in Number.isFinite

    Validate row input instead of blind parseInt(prompt(), 10).

  5. 5. console.log After the Inner Loop

    Calling it inside the letter loop breaks the triangle into a column.

Pro Tip: if you see E, ED, EDC, the inner loop is decrementing — that is Program 2, not this page.

Common Pitfalls

Mistakes that commonly break reverse-starting-letter triangles.

  1. 1. Using j-- by Mistake

    Produces Program 2’s descending rows (E, ED, EDC).

    → Append with j++ from code to top — not a descending inner loop.

  2. 2. Starting Inner Loop at A

    Gives Program 1’s prefixes instead of suffixes to top.

    → Start j at i, not at 'A'.

  3. 3. Rows Beyond 26

    Large rows values can walk past Z.

    → Clamp rows to 1–26 for A–Z demos.

  4. 4. Blind parseInt(prompt())

    Empty or non-numeric input throws.

    → Use Number.isFinite and clamp rows to 1..26.

  5. 5. console.log Inside the Inner Loop

    Prints one letter per line instead of a triangle.

    → Call console.log(line) only after the letter loop finishes.

Edge Cases

Check these inputs before calling the solution done.

rows = 1

Single letter

Output is just A.

rows = 5

Classic sample

E through ABCDE with right edge E.

rows = 4

Smaller triangle

D, CD, BCD, ABCD (Example 2).

rows > 26

Past Z

Clamp or define a wrap/error policy.

Bad input

Non-numeric

Validate with Number.isFinite.

Lowercase

a-based top

Use 'a' as the base instead of 'A'.

🎯 Practice Problems

Try these variations to lock in the pattern.

1. Flip to Program 2

  • Change the inner loop to j-- from top
  • Confirm you get E, ED, EDC, …

2. Add spaces

  • Print j + " " (Example 3)
  • Keep the same loop bounds

3. Scale to 8 rows

  • Set rows = 8 so top = H
  • Check every row ends at H

4. Continue to Program 4

Notes

  • Start moves back. Outer i walks E, D, C, … while the right edge stays fixed.
  • Inner loop uses j++ from code to top — not a descending inner loop.
  • Letter count is the triangular number n(n+1)/2.
  • Program 4 flips again: each row starts later and prints backward to A.

Quick Takeaway: move the start letter backward, append forward to a fixed top, then call console.log(line).

⏱️ Time and Space Complexity

ProgramTimeExtra space
Inline / input (Examples 1–2)O(n²)O(1)
Spaced letters (Example 3)O(n²)O(1)

For n rows you print 1+2+…+n = n(n+1)/2 letters, so total work is O(n²).

Wrap Up

🎉 Conclusion

The reverse-starting-letter alphabet triangle keeps a fixed right edge while the left side grows: start letter moves from top down to A, and each row prints forward to top. Master the classic E…ABCDE sample, then try user input and the spaced rewrite.

Practice the three examples above, then continue to Program 4’s reverse-order alphabet triangle (A, BA, CBA, …).

Outer code from top to A, inner j from code to top, then console.log(line).

💡 Best Practices

✅ Do

  • Start the inner loop at i and increment to top
  • Derive top from the row count
  • Cap rows at 26 for A–Z demos
  • Validate row input with Number.isFinite
  • State O(n²) when asked about complexity

❌ Don’t

  • Decrement the inner loop (that is Program 2)
  • Start the inner loop at A every row (that is Program 1)
  • Let rows walk past Z without a policy
  • Call console.log(line) inside the letter loop
  • Skip validating row-count input

Key Takeaways

Knowledge Unlocked

Five things to remember about this alphabet pattern

Print the reverse-starting-letter alphabet triangle the beginner-friendly way.

5
Core concepts
> 02

Inner

j from i to top

Code
E 03

Right edge

Always top

Shape
04

console.log

Ends each row

I/O
O 05

Complexity

O(n²) time

Analysis

❓ Frequently Asked Questions

The outer loop moves the starting letter from E down to A. The inner loop always appends forward from that start letter up to E (or top), so the last character remains E on every row.
Program 2 prints letters descending along the row (E, ED, EDC). This program prints forward along the row (E, DE, CDE) while only the row's first letter moves backward.
Program 1 always starts at A and grows the end letter (A, AB, ABC). This pattern grows the start letter backward while keeping the right edge fixed at top.
Yes. Read rows with prompt(), set top = 'A'.charCodeAt(0) + rows - 1, then loop code from top down to 'A'.charCodeAt(0) and append j from code up to top.
O(n^2) for n rows, because the total printed letters are 1+2+...+n = n(n+1)/2.
Use parseInt(prompt(), 10) and check Number.isFinite, require n >= 1, and cap at 26 so the top letter stays within A-Z.
Because the inner loop always stops at top (E in the fixed example), so the last printed character is always that same letter.
Yes. Use 'a'.charCodeAt(0) as the base: top = 'a'.charCodeAt(0) + rows - 1, then loop the same way from code up to top.

Did you Know? 🔊

This triangle changes only the starting letter of each row (E, D, C, …), while letters along the row still increase forward. In the 5-row example, every row ends at E, producing E, DE, CDE, BCDE, ABCDE.

Continue to Alphabet Pattern 4

Next up: reverse-order alphabet triangles where each row starts later and prints backward to A.

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