Jorge Saavedraalgoritmosmatematicascombinatoriajavascript
Este es un clásico problema de combinatoria: ¿de cuántas maneras distintas se pueden colocar 8 torres en un tablero de ajedrez 8x8 sin que se amenacen entre sí?
La condición clave es que no haya dos torres en la misma fila ni en la misma columna. Así, el problema se reduce a encontrar todas las permutaciones posibles de 8 elementos.
¿Por qué 8!?
Piénsalo así: asignas una torre a cada fila y eliges en qué columna ponerla. Para la primera fila tienes 8 columnas disponibles. Para la segunda, 7 (porque una ya está ocupada). Para la tercera, 6. Y así sucesivamente.
8 x 7 x 6 x 5 x 4 x 3 x 2 x 1 = 8! = 40,320
Hay 40,320 formas de colocar 8 torres sin que se amenacen.
Visualizándolo con código
Una permutación aleatoria de los números del 0 al 7 nos da una configuración válida. Cada posición del array representa una fila, y el valor representa la columna donde va la torre. Por ejemplo,
[3, 1, 6, 2, 5, 7, 4, 0] significa: fila 0 tiene torre en columna 3, fila 1 en columna 1, y así.Este es el componente completo en React con TypeScript:
Chessboard.tsx
'use client';
import React, { useEffect, useState } from 'react';
const generateRandomPermutation = (): number[] => {
const columns = [0, 1, 2, 3, 4, 5, 6, 7];
for (let i = columns.length - 1; i > 0; i--) {
const j = Math.floor(Math.random() * (i + 1));
[columns[i], columns[j]] = [columns[j], columns[i]];
}
return columns;
};
const Chessboard: React.FC = () => {
const [positions, setPositions] = useState<number[] | null>(null);
const [count, setCount] = useState(1);
useEffect(() => {
setPositions(generateRandomPermutation());
}, []);
const handleGenerate = () => {
setPositions(generateRandomPermutation());
setCount(prev => prev + 1);
};
if (!positions) return null;
return (
<div className="flex flex-col items-center gap-4">
<div className="border-2 border-neutral-300 rounded-lg overflow-hidden">
<div className="grid grid-cols-8" style={{ width: '320px', height: '320px' }}>
{Array.from({ length: 8 }).map((_, row) =>
Array.from({ length: 8 }).map((_, col) => {
const isLight = (row + col) % 2 === 0;
const hasRook = positions[row] === col;
return (
<div
key={`${row}-${col}`}
className={`flex items-center justify-center ${
isLight ? 'bg-amber-100' : 'bg-amber-800'
}`}
style={{ width: '40px', height: '40px' }}
>
{hasRook && (
<span className={`text-2xl ${
isLight ? 'text-neutral-900' : 'text-white'
}`}>
\u265C
</span>
)}
</div>
);
})
)}
</div>
</div>
<button onClick={handleGenerate} className="px-5 py-2.5 text-sm font-medium rounded-lg text-white bg-neutral-800 hover:bg-neutral-700">
Generar nueva posicion (#{count} de 40,320)
</button>
<div className="text-xs font-mono text-neutral-400">
[{positions.join(', ')}]
</div>
</div>
);
};
export default Chessboard;El generador usa un Fisher-Yates shuffle: recorre el array de derecha a izquierda y en cada posición intercambia con un índice aleatorio anterior. Esto garantiza que cada una de las 40,320 permutaciones tiene la misma probabilidad de aparecer.
Pruébalo
Cada vez que presionas el botón, se genera una de las 40,320 configuraciones posibles:
En resumen
El problema de las 8 torres es una forma elegante de entender las permutaciones. La restricción de "una por fila, una por columna" elimina la complejidad y lo convierte en un factorial directo.
Su primo más famoso, el problema de las 8 reinas, agrega la restricción de las diagonales y reduce las soluciones de 40,320 a solo 92. Pero eso queda para otro post.
