Full Symmetric Square

Beginner
⏱️ 12 min read
📚 Updated: Aug 2025
🎯 2 Code Examples
Top + bottom halves
JavaScript alphabet pattern 29 output: symmetric square from E down to A and back to E

What You'll Learn

This pattern is a full symmetric version of Program 28. First we print rows for E..A, then we mirror by printing rows for B..E. Each row is built using two halves and the condition j > i.

⭐ Pattern Output

Output
E E E E E E E E E
E D D D D D D D E
E D C C C C C D E
E D C B B B C D E
E D C B A B C D E
E D C B B B C D E
E D C C C C C D E
E D D D D D D D E
E E E E E E E E E
1

Node.js / console version

Print the top half (E..A) then the bottom half (B..E). Each row uses left + right halves.

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

function printRow(i) {
  let line = "";
  for (let j = top; j >= A; j--) line += (j > i ? String.fromCharCode(j) : String.fromCharCode(i)) + " ";
  for (let j = A + 1; j <= top; j++) line += (j > i ? String.fromCharCode(j) : String.fromCharCode(i)) + " ";
  console.log(line.trimEnd());
}

for (let i = top; i >= A; i--) printRow(i);
for (let i = A + 1; i <= top; i++) printRow(i);
Try it Yourself
2

Browser version (document.write + div)

Reference-style output using fixed-width cells.

HTML
<!DOCTYPE html>
<html>
<head>
  <style>
    div.cell {
      display: inline-block;
      text-align: center;
      width: 15px;
    }
  </style>
</head>
<body>
<script>
  const A = 65;
  const top = 69;

  function printRow(i) {
    for (let j = top; j >= A; j--) {
      if (j > i) document.write("<div class=\\"cell\\">" + String.fromCharCode(j) + "</div>");
      else document.write("<div class=\\"cell\\">" + String.fromCharCode(i) + "</div>");
    }
    for (let j = A + 1; j <= top; j++) {
      if (j > i) document.write("<div class=\\"cell\\">" + String.fromCharCode(j) + "</div>");
      else document.write("<div class=\\"cell\\">" + String.fromCharCode(i) + "</div>");
    }
    document.write("<br>");
  }

  for (let i = top; i >= A; i--) printRow(i);
  for (let i = A + 1; i <= top; i++) printRow(i);
</script>
</body>
</html>
Try it Yourself

🧠 How It Works

1

Core idea

This is Program 28 plus a mirrored bottom half. First part prints rows for i = E..A, second part prints rows for i = B..E. Each row is built from two loops (left half and right half) using the condition j > i to decide whether to print the column letter or the row letter.

Logic
2

Loops + condition

An outer loop picks the row, inner loop(s) decide what to print (letter / star / blank) based on comparisons.

Nested loops
=

Connect it to the output

Compare each loop boundary with the pattern output above — each row corresponds to one outer iteration.

Key Takeaways

1

Two parts: top (E..A) and bottom (B..E).

2

Two halves per row create symmetry.

3

j > i chooses outer letter vs row letter.

4

Time complexity: O(n²).

❓ Frequently Asked Questions

Program 28 prints only the top half (E..A). Program 29 adds the mirrored bottom half (B..E), so the full output becomes a symmetric square.
The middle row happens when i = A. With the condition j > i, most positions keep their outer column letter, while the center position becomes A.
HTML collapses normal whitespace, so gaps don’t align reliably. Fixed-width div cells preserve the grid and keep the square aligned.

More JavaScript alphabet patterns

Browse the full list for more variations.

Next: Program 30 →

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.

AWS Certified Developer – Associate (Credly)

10 people found this page helpful

JavaScript Alphabet Pattern 28 JavaScript Alphabet Pattern 30