He estado trabajando en un proyecto de reacción simple en el que encontré este fragmento
let hand1 =[] let hand2 =[ ...this.props.pokemon]; while(hand1.length < hand2.length){ let randIdx = Math.floor(Math.random()*hand2.length); let randPokemon = hand2.splice(randIdx,1)[0]; hand1.push(randPokemon) }¿Cuál es el uso de ..this.props.pokemon aquí?
En su caso, copia en profundidad la matriz de pokemon de sus props y evita la mutación de la matriz/objeto original
Eche un vistazo a este ejemplo donde no se usa la spread syntax :
const firstArray = [1, 2]; const secondArray = firstArray; secondArray[0] = 9; console.log(firstArray); Y aquí es cuando se usa spread syntax
const firstArray = [1, 2]; const secondArray = [...firstArray]; secondArray[0] = 9; console.log(firstArray);let hand2 = [ ...this.props.pokemon] La expresión anterior toma todos los valores dentro this.props.pokemon y los coloca dentro de la matriz hand2 .
Por ejemplo:
const fruits = ['apple', 'banana'] const breakfast = [...fruits, 'milk'] console.log(breakfast) -> ['apple', 'banana', 'milk']Mientras que si no tiene el operador de propagación (...). Pondrá toda la matriz allí en lugar de solo los valores. Por ejemplo:
const fruits = ['apple', 'banana'] const breakfast = [fruits, 'milk'] console.log(breakfast) -> [['apple', 'banana'], 'milk']