Creating a binary spiral array of specific size in JavaScript

We are required to write a JavaScript function that takes in a number n. Our function should construct and return an array of N * N order (2-D array), in which the 1s take all the spiralling positions starting from [0, 0] and all the 0s take non-spiralling positions.

Therefore, for n = 5, the output will look like:

[
  [ 1, 1, 1, 1, 1 ],
  [ 0, 0, 0, 0, 1 ],
  [ 1, 1, 1, 0, 1 ],
  [ 1, 0, 0, 0, 1 ],
  [ 1, 1, 1, 1, 1 ]
]

Understanding the Spiral Pattern

The spiral moves clockwise from the top-left corner: right ? down ? left ? up, repeating this pattern while spiraling inward. Each complete spiral layer creates a border of 1s with 0s in the inner area.

Algorithm Implementation

The algorithm uses four boundaries (left, right, top, bottom) and moves in a spiral pattern, placing 1s on the spiral path. After each complete layer, the boundaries shrink by 2 positions to create the next inner spiral.

const num = 5;
const spiralize = (num = 1) => {
    const arr = [];
    let x, y;
    
    // Initialize grid with zeros
    for (x = 0; x < num; x++) {
        arr[x] = Array.from({ length: num }).fill(0);
    }
    
    let left = 0;
    let right = num;
    let top = 0;
    let bottom = num;
    x = left;
    y = top;
    let h = Math.floor(num / 2);
    
    // Create spiral pattern
    while (left < right && top < bottom) {
        // Move right
        while (y < right) {
            arr[x][y] = 1;
            y++;
        }
        y--;
        x++;
        top += 2;
        if (top >= bottom) break;
        
        // Move down
        while (x < bottom) {
            arr[x][y] = 1;
            x++;
        }
        x--;
        y--;
        right -= 2;
        if (left >= right) break;
        
        // Move left
        while (y >= left) {
            arr[x][y] = 1;
            y--;
        }
        y++;
        x--;
        bottom -= 2;
        if (top >= bottom) break;
        
        // Move up
        while (x >= top) {
            arr[x][y] = 1;
            x--;
        }
        x++;
        y++;
        left += 2;
    }
    
    // Handle even-sized grids
    if (num % 2 == 0) arr[h][h] = 1;
    
    return arr;
};

console.log(spiralize(num));

[
  [ 1, 1, 1, 1, 1 ],
  [ 0, 0, 0, 0, 1 ],
  [ 1, 1, 1, 0, 1 ],
  [ 1, 0, 0, 0, 1 ],
  [ 1, 1, 1, 1, 1 ]
]

Testing Different Sizes

// Test with different sizes
console.log("n = 3:");
console.log(spiralize(3));
console.log("\nn = 4:");
console.log(spiralize(4));
console.log("\nn = 6:");
console.log(spiralize(6));

n = 3:
[
  [ 1, 1, 1 ],
  [ 0, 0, 1 ],
  [ 1, 1, 1 ]
]

n = 4:
[
  [ 1, 1, 1, 1 ],
  [ 0, 0, 0, 1 ],
  [ 1, 0, 0, 1 ],
  [ 1, 1, 1, 1 ]
]

n = 6:
[
  [ 1, 1, 1, 1, 1, 1 ],
  [ 0, 0, 0, 0, 0, 1 ],
  [ 1, 1, 1, 1, 0, 1 ],
  [ 1, 0, 0, 0, 0, 1 ],
  [ 1, 0, 1, 1, 1, 1 ],
  [ 1, 1, 1, 0, 0, 0 ]
]

How It Works

The algorithm maintains four boundary variables and follows these steps:

• Initialization: Create n×n grid filled with zeros
• Spiral Movement: Move right ? down ? left ? up, placing 1s
• Boundary Updates: After each direction, shrink boundaries by 2
• Special Case: For even n, set center position to 1

Conclusion

This algorithm efficiently creates a binary spiral array by tracking boundaries and moving in a clockwise pattern. The key insight is adjusting boundaries by 2 after each complete direction to maintain the spiral structure with proper spacing.