HTML Code

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>JS Number Pattern 59 - Try It</title>
</head>
<body>
  <h1>Border Number Square (Hollow 5×5)</h1>
  <p>Edit n and click Run.</p>
  <pre id="output"></pre>
  <script>
    const n = 5;
    const cellWidth = 2;
    let top = 1;
    let right = n + 1;
    let bottom = n * 2 + 3;
    let left = n * 3 + 1;
    let result = "";
    for (let i = 1; i <= n; i++) {
      let line = "";
      for (let j = 1; j <= n; j++) {
        let v = null;
        if (i === 1) v = top++;
        else if (j === n) v = right++;
        else if (i === n) v = bottom--;
        else if (j === 1) v = left--;
        if (v === null) line += " ".repeat(cellWidth + 2);
        else line += String(v).padStart(cellWidth, " ") + " ";
      }
      result += line.trimEnd() + "\n";
    }
    document.getElementById("output").textContent = result;
  </script>
</body>
</html>

Lines: 0 | Characters: 0

Live Preview Auto-refresh on Run

JavaScript Number Pattern 59 (Try It)