Dada una matriz de cadenas,
const bestRappers = ["Ice Cube", "MC Eiht", "Eazy-E"] const output = document.getElementById('output') /* 1: */ console.log(...bestRappers) /* 2: */ output.innerText = [...bestRappers] <p id="output"></p>2 devuelve los elementos separados por comas. 1 No está separado. ¿Por qué?
Lo que hace un operador de propagación es tomar un iterable (en su caso, una matriz) y darle una cantidad n de argumentos.
En el primer caso, console.log es una función, por lo que le da 3 argumentos console.log(...bestRappers) ---> console.log(Ice Cube,MC Eiht,Eazy-E), por lo que generalmente la función console.log registra cada argumento espacio separado
En el segundo caso, distribuye la matriz en una matriz nuevamente ([... bestRappers]) de modo que cuando asigna la matriz a un texto interno, se muestra como valores separados por comas
Si desea obtener el mismo resultado en su consola que en su dom, debe usar la función JavaScript join() con coma como separador.
ejemplo de trabajo
bestRappers = ["Ice Cube", "MC Eiht", "Eazy-E"]; console.log(bestRappers.join(', ')); output.innerText = [...bestRappers] <p id="output"></p>