Estoy tratando de hacer un buscaminas, y ha sucedido algo extraño, en los navegadores basados en Chrome o Chromium todo parece y funciona bien, pero en Firefox, todas las bombas generadas se agrupan al final o al comienzo de la matriz. , ¿hay alguna diferencia en cómo sort() funciona con parámetros?
Dejo el trozo de código que genera el tablero.
function createBoard() { //create an array with shuffled bombs const bombsArray = Array(bombAmount).fill("bomb"); const emptyArray = Array(width * width - bombAmount).fill("valid"); const gameArray = emptyArray.concat(bombsArray); const shuffledArray = gameArray.sort(() => Math.random() - 0.5); for (let i = 0; i < width * width; i++) { const square = document.createElement("div"); square.setAttribute("id", i); square.classList.add(shuffledArray[i]) grid.appendChild(square); squares.push(square);De la documentación :
Nota:
compareFunction(a, b)siempre debe devolver el mismo valor cuando se le da un par específico de elementos a y b como sus dos argumentos.
En su caso, no hace esto, lo que da un comportamiento indefinido, muy probablemente dependiendo del algoritmo de clasificación que utiliza la implementación Array.sort del navegador.
Puede asegurarse de que el valor aleatorio para un elemento de matriz en particular permanezca estable mapeando una nueva matriz con una propiedad de order aleatorio, ordenando y luego mapeando de nuevo:
const shuffledArray = gameArray .map((value) => ({ value, order: Math.random() })) .sort((a, b) => a.order - b.order) .map(({ value }) => value)Probablemente esta no sea la forma más eficiente de barajar una matriz, pero un tablero de buscaminas es tan pequeño que no importará.