JavaScript Mirrored Alphabet Pattern (Spaced)

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

What Is This Pattern?

A mirrored alphabet pattern with spaces keeps a fixed total width and splits each row into two scans: grow letters on the left, then a shrinking gap, then the mirror on the right — until the last row meets.

Remember
Rule: left A..i | gap | right i..A  (gap shrinks to 0)

A        A
AB      BA
ABC    CBA
ABCD  DCBA
ABCDEEDCBA     ← top = E

Contrast Program 18 (continuous palindrome, no gap). Here the middle spaces shrink each row until both halves touch as ABCDEEDCBA.

How to Solve It

Either scan each half with letter-or-space conditions, or append left letters, an explicit gap, then the mirror.

MethodIdeaBest for
Dual fixed scanLeft: letter if j <= i else space; right: space if k > i else letterLearning the classic dual pass
Letters + gap + mirrorAppend A..i, then 2*(n-i) spaces, then i..AClearer separation of concerns

Pseudocode

Pseudocode
n = last index (e.g. 4 for A..E)
for i from 0 to n:
    line = ""
    for j from 0 to i:          // left letters
        append letter j
    for g from 1 to 2*(n - i):  // middle gap
        append ' '
    for k from i down to 0:     // right mirror
        append letter k
    print line

Cheat sheet

GoalPattern
Last index from top letterconst n = top.charCodeAt(0) - "A".charCodeAt(0);
Walk rowsfor (let i = 0; i <= n; i++)
Left rampfor (let j = 0; j <= i; j++) line += alpha[j];
Gap size2 * (n - i) spaces
Right mirrorfor (let k = i; k >= 0; k--) line += alpha[k];
End the rowconsole.log(line);
Row widthAlways 2 * (n + 1) characters

Printing Letters vs Starting a New Line

APIEffectUse for
line += ch / " "Stays on the same rowEach letter and each space
console.log(line)Ends the current rowAfter left + gap + right

Append without a newline, then end the row once.

Live Preview

Change the size (top letter) and the mirrored space pattern updates instantly — including gap on the first row and fixed width.

Whole numbers from 1 to 10. Size 5 means top letter E. Tap a chip or type a value — the preview redraws as you go.

Live result 5 letters · top E · width 10
A        A
AB      BA
ABC    CBA
ABCD  DCBA
ABCDEEDCBA

Worked Walkthrough — top = D (n = 3)

Trace each row peak and how many gap spaces sit between the halves (width always 8).

iLeftGapRightPrinted row
0A6AA A
1AB4BAAB BA
2ABC2CBAABC CBA
3ABCD0DCBAABCDDCBA

Each of n+1 rows prints 2(n+1) characters → still O(n²) total work.

JavaScript Programs

Three complete programs: fixed A–E dual scan, top-letter prompt, and an explicit gap-count style. Use View Output for sample results, or Try It Yourself to edit and run in the playground.

Example 1 — Fixed A–E

Two fixed-width scans per row. Conditions decide whether to append a letter or a space.

JavaScript
const alpha = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";

for (let i = 0; i < 5; i++) {
  let line = "";
  for (let j = 0; j < 5; j++) {
    if (j <= i) {
      line += alpha[j];
    } else {
      line += " ";
    }
  }
  for (let k = 4; k >= 0; k--) {
    if (k > i) {
      line += " ";
    } else {
      line += alpha[k];
    }
  }
  console.log(line);
}
Try It Yourself

How It Works

1. Outer loop picks the peak index. i runs 0..4 so peaks are A..E.

2. Left pass. For each column j, append alpha[j] if j <= i, else a space.

3. Right pass. Scan k from 4 down to 0: space while k > i, else alpha[k].

4. Break the line. console.log(line) after both halves finish.

When i = 2: left ABC + 2 spaces, right 2 spaces + CBA. When i = 4: no spaces → ABCDEEDCBA.

Example 2 — Top Letter Input

Build the full width dynamically from the chosen top letter. Validate a single A–Z character.

JavaScript
const raw = (prompt("Enter the top letter (like E):") || "").trim().toUpperCase();
const alpha = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";

if (!/^[A-Z]$/.test(raw)) {
  console.log("Please enter a single letter A-Z.");
} else {
  const n = raw.charCodeAt(0) - "A".charCodeAt(0);

  for (let i = 0; i <= n; i++) {
    let line = "";
    for (let j = 0; j <= n; j++) {
      line += (j <= i) ? alpha[j] : " ";
    }
    for (let k = n; k >= 0; k--) {
      line += (k > i) ? " " : alpha[k];
    }
    console.log(line);
  }
}
Try It Yourself

How It Works

1. Prompt and validate. Trim, uppercase, and require a single A–Z letter.

2. Derive half-width. n = top - A sets the shared scan bound. With C, the last row meets as ABCCBA.

3. Same dual-scan core. Only the bound n changes — the print logic matches Example 1.

Example 3 — Letters, Gap Count, Mirror

Often clearer: append left letters, append 2*(n - i) spaces, then append the reverse letters.

JavaScript
const n = 4; // last index (E)
const base = "A".charCodeAt(0);

for (let i = 0; i <= n; i++) {
  let line = "";
  for (let j = 0; j <= i; j++) {
    line += String.fromCharCode(base + j);
  }
  for (let g = 0; g < 2 * (n - i); g++) {
    line += " ";
  }
  for (let k = i; k >= 0; k--) {
    line += String.fromCharCode(base + k);
  }
  console.log(line);
}
Try It Yourself

How It Works

1. Left letters only. Append A through the current peak — no padding in this loop.

2. Explicit gap. 2 * (n - i) is the leftover columns the dual scan would fill with spaces on both halves.

3. Mirror. Append peak down to A. On the last row the gap is 0, so halves meet (peak letter appears twice).

Edge Cases & Pitfalls

Check these before calling the solution done.

wrong gap

Uneven / jagged width

Use 2 * (n - i) for the explicit gap. A factor of 1 makes an odd gap and breaks the fixed 2(n+1) width.

log early

Split halves

Call console.log only after left, gap, and right finish. Logging earlier splits one row into pieces.

Reuse line

Growing leftovers

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

vs Program 18

No gap vs gap

Program 18 mirrors without a middle band (ABCBA). This pattern keeps spaces until the final meeting row.

top = A

Single AA

Output is AA (left A + right A, zero gap) — a good sanity check.

Bad prompt

Validate one letter

Reject empty strings and multi-character input before computing n.

Time and Space Complexity

ProgramTimeExtra space
Dual scan (Examples 1–2)O(n²)O(n) for the current line string
Explicit gap (Example 3)O(n²)O(n) for the current line string

Each of n+1 rows prints 2(n+1) characters (letters + spaces), so total work is still quadratic in n.

Key Takeaways

  • Rule: left ramp + shrinking gap + right mirror; last row has no gap.
  • Gap: 2 * (n - i) spaces — zero on the final row.
  • Break the row: call console.log(line) only after all three parts.
  • Complexity: O(n²) time from dual fixed-width scans per row.

One line: for each peak i, print A..i, then 2*(n-i) spaces, then i..A.

Frequently Asked Questions

The left loop builds the increasing part and fills the remaining columns with spaces. The right loop fills spaces until the peak, then appends the decreasing mirror.
The spaces keep both halves fixed width so the mirror effect is aligned. The gap shrinks each row until both halves touch.
When i reaches the last letter (E), all positions satisfy the letter conditions on both sides, so both halves print letters and meet as ABCDEEDCBA.
Increase the last index/letter and update the loop bounds so the left and right halves each scan the new width.
line += ch or line += ' ' stays on the same row for each cell. console.log(line) ends the row after both halves finish.
Program 18 prints a continuous palindrome with no middle gap. This pattern keeps a shrinking space band between left and right ramps until the final row.
O(n²) for n letters because each row scans n columns twice (left + right).
Use prompt().trim().toUpperCase(), require a single A–Z character, and reject empty tokens. Cap at Z if you only want alphabetic ranges.

Did you know?

Each row uses two fixed-width scans from A to E. The first builds the left ramp (letters when j <= i else spaces). The second builds the right ramp (spaces while k > i, else letters). The gap shrinks until the last row meets as ABCDEEDCBA.

Next: Right-Aligned Reverse Pyramid

Leading spaces + reverse letters — A, BA, CBA, DCBA, EDCBA.

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