Mirror Diagonal Number Pattern in JavaScript

What You’ll Learn

Program 53 prints a mirror diagonal number pattern: each row shows the row number on the main diagonal (left) and on a mirrored diagonal (right), forming a symmetric V-shape — a natural step after Program 52’s palindromic pyramid. This tutorial covers two inner loops with i === j and i === k conditions, a live preview, worked JavaScript examples, edge cases, and complexity.

📝 Problem & Approach

Given row count rows = 5, print a mirror diagonal number pattern — row i shows digit i on both diagonals with spaces between.

// rows = 5
// 1       1
//  2     2
//   3   3
//    4 4
//     5

Inputs & Outputs

Minimal workflow

for i from 1 to rows:
    line = ""
    for j from 1 to rows:
        append digit if i === j else space
    for k from rows - 1 down to 1:
        append digit if i === k else space
    console.log(line)

Approach comparison

🔮 Live Preview

Choose row count between 3 and 9 and draw the mirror diagonal number pattern in the browser.

Press "Draw pattern".

Examples Gallery

Three complete JavaScript programs — fixed rows, user input, and a compact trace demo. Click View Output to reveal sample console results, or Try it Yourself to run in the browser.

const rows = 5;

for (let i = 1; i <= rows; i++) {
  let line = "";

  for (let j = 1; j <= rows; j++) {
    line += (i === j ? i : " ");
  }

  for (let k = rows - 1; k >= 1; k--) {
    line += (i === k ? i : " ");
  }

  console.log(line);
}

1       1
 2     2
  3   3
   4 4
    5

const rowsInput = prompt("Enter the number of rows:");
const rows = parseInt(rowsInput, 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 <= rows; j++) {
      line += (i === j ? i : " ");
    }

    for (let k = rows - 1; k >= 1; k--) {
      line += (i === k ? i : " ");
    }

    console.log(line);
  }
}

Enter the number of rows: 4
1     1
 2   2
  3 3
   4

const rows = 3;

for (let i = 1; i <= rows; i++) {
  let line = "";

  for (let j = 1; j <= rows; j++) {
    line += (i === j ? i : " ");
  }

  for (let k = rows - 1; k >= 1; k--) {
    line += (i === k ? i : " ");
  }

  console.log(line);
}

1   1
 2 2
  3

🔎 Worked Walkthrough — rows = 5

Trace each row’s left diagonal position, right diagonal position, and full line output.

Row 5 prints only one digit because the right loop starts at rows - 1, avoiding a duplicate center column.

🎯 Practice Problems

Try these variations to lock in the pattern.

Notes

⏱️ Time and Space Complexity

💡 Best Practices