3

He visto en internet sobre éste código y no logro entender bien del todo de lo que sucede tras esto, veo que separa los valores de la clave modo y los muestra en un nuevo objeto, pero no entiendo porqué sucede esto.

let obj = {modo: "COM"}
console.log({...obj.modo})

2 respuestas 2

5

Spread Operator

La sintaxis spread (...) permite expandir un elemento iterable, como una matriz o una cadena, en lugares donde se esperan cero o más argumentos (para llamadas a funciones) o elementos (para literales de matriz). En un literal de objeto, la sintaxis de propagación enumera las propiedades de un objeto y agrega los pares clave-valor al objeto que se está creando.

Con ...

introducir la descripción de la imagen aquí

Distribuye los elementos dentro de un iterable.

introducir la descripción de la imagen aquí

El texto que no era iterable ahora iterado con un for in

    let obj = {modo: "COM"}
    let iterable = {...obj.modo}
    
    for (const property in iterable) {
      console.log(`${property}: ${iterable[property]}`);
    }
    

Sin ...

introducir la descripción de la imagen aquí

Spread Operator puede utilizarse cuando todos los elementos de un objeto o matriz deben incluirse en una nueva matriz u objeto, o deben aplicarse uno por uno en la lista de argumentos de una llamada a función.

Otro usos

Copiar arreglo mediante ...

También puede utilizar la sintaxis de propagación para copiar los elementos en una sola matriz. Por ejemplo...

const arr1 = ['one', 'two'];
const arr2 = [...arr1, 'three', 'four', 'five'];

console.log(arr2); 
//  Output:
//  ["one", "two", "three", "four", "five"]

Clonar matriz usando el operador Spread

En JavaScript, los objetos se asignan por referencia y no por valores. Por ejemplo

Aquí ambas variables se refieren a la misma matriz

let arr1 = [ 1, 2, 3];
let arr2 = arr1;

console.log(arr1); // [1, 2, 3]
console.log(arr2); // [1, 2, 3]

// append an item to the array
arr1.push(4);

console.log(arr1); // [1, 2, 3, 4]
console.log(arr2); // [1, 2, 3, 4]

Si quieres copiar matrices para que no hagan referencia a la misma matriz, puede utilizar el operador de propagación. De esta manera, el cambio en una matriz no se refleja en la otra. Por ejemplo

let arr1 = [ 1, 2, 3];

// copy using spread syntax
let arr2 = [...arr1];

console.log(arr1); // [1, 2, 3]
console.log(arr2); // [1, 2, 3]

// append an item to the array
arr1.push(4);

console.log(arr1); // [1, 2, 3, 4]
console.log(arr2); // [1, 2, 3]
1
  • 2
    Muchas gracias amigo, alfin me quedo claro jaja Commented el 26 ene. 2023 a las 20:22
1

EL código hace uso del Spread Operator (...) segun la documentacion de MDN Web Doc:

'Permite a un elemento iterable tal como un arreglo o cadena ser expandido en lugares donde cero o más argumentos (para llamadas de función) o elementos (para Array literales) son esperados, o a un objeto ser expandido en lugares donde cero o más pares de valores clave (para literales Tipo Objeto) son esperados'.

En tu caso estás utilizando spread sobre el valor de una sola propiedad y lo colocas como contenido de un objeto nuevo. Si usas Spread (desparramar, separar) de esa forma crearas un objeto con pares clave valor de la forma 'numero: letra', ese número será 0 para la primera propiedad, 1 para la segunda etc como si fueran los índices de un arreglo, y las letras de tu propiedad 'modo' serían los valores para esas claves, por lo que tendrías un objeto nuevo con 4 propiedades y las letras de 'modo' como sus valores.

Distinto seria si hicieses eso pero con un array:

let obj = {modo: "COM", interconectado: "WWW"}
console.log([...obj.interconectado]) // output: ["W","W","W"]

En este caso las claves numéricas ya no son necesarias porque los arrays ya cuentan con índices. Ya te dieron una buena respuesta así que dejo mi explicación aqui jeje.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.