Estoy mapeando a través de una matriz y quiero que el resultado sea el siguiente:
Array.from([1,2,3,4,5,6,7,8,9,10]).map((number, index) => console.log(index)) // 0-white 1-black 2-black 3-white 4-white 5-black 6-black 7-white 8-white 9-black ¿Cómo puedo hacer esto usando el índice de Array.map ?
Para el contexto, estoy mapeando una lista de elementos para mostrar en una cuadrícula de dos columnas. Necesito usar JS, por lo tanto, el index debe inferir el color correcto y no puedo usar CSS en este escenario.
Por mi vida, no puedo descifrar la lógica matemática para obtener el color correcto.
Una forma de hacer esto es XOR los 2 bits más bajos de index , lo que le dará un patrón de 0,1,1,0 que luego se puede traducir a black y white :
result = Array.from([1,2,3,4,5,6,7,8,9,10]) .map((_, index) => (index & 1) ^ (index >> 1 & 1) ? 'black' : 'white') console.log(result)Algo como
const pattern = ["white", "black", "black", "white"]; Array.from([1,2,3,4,5,6,7,8,9,10]).map((_, i) => { console.log(i, pattern[i % pattern.length]) })