Skip to main content
Commonmark migration
Origen Enlace

Supongamos que tenemos esta función:

function f({algo, algoMas, todaviaMas}) {
    //...
}

Esto sería equivalente a escribir algo así:

function f(o) {
    var algo = o.algo;
    var algoMas = o.algoMas;
    var todaviaMas = o.todaviaMas;
    //...
}

Como verás es una forma de utilizar una sintaxis mas compacta para la asignación de variables que forman parte de un objeto que se recibe como parámetro en este caso.

Ejemplo, los siguientes dos snippets hacen lo mismo:

###Sin destructuring

Sin destructuring

function f(o) {
    var algo = o.algo;
    var algoMas = o.algoMas;
    var todaviaMas = o.todaviaMas;
    
    console.log(`algo: ${algo}`);
    console.log(`algoMas: ${algoMas}`);
    console.log(`todaviaMas: ${todaviaMas}`);
}

var o = {
  algo: 1,
  todaviaMas: 2,
  algoMas: 3
};

f(o);

###Con destructuring

Con destructuring

function f({algo, algoMas, todaviaMas}) {
    console.log(`algo: ${algo}`);
    console.log(`algoMas: ${algoMas}`);
    console.log(`todaviaMas: ${todaviaMas}`);
}

var o = {
  algo: 1,
  todaviaMas: 2,
  algoMas: 3
};

f(o);

Supongamos que tenemos esta función:

function f({algo, algoMas, todaviaMas}) {
    //...
}

Esto sería equivalente a escribir algo así:

function f(o) {
    var algo = o.algo;
    var algoMas = o.algoMas;
    var todaviaMas = o.todaviaMas;
    //...
}

Como verás es una forma de utilizar una sintaxis mas compacta para la asignación de variables que forman parte de un objeto que se recibe como parámetro en este caso.

Ejemplo, los siguientes dos snippets hacen lo mismo:

###Sin destructuring

function f(o) {
    var algo = o.algo;
    var algoMas = o.algoMas;
    var todaviaMas = o.todaviaMas;
    
    console.log(`algo: ${algo}`);
    console.log(`algoMas: ${algoMas}`);
    console.log(`todaviaMas: ${todaviaMas}`);
}

var o = {
  algo: 1,
  todaviaMas: 2,
  algoMas: 3
};

f(o);

###Con destructuring

function f({algo, algoMas, todaviaMas}) {
    console.log(`algo: ${algo}`);
    console.log(`algoMas: ${algoMas}`);
    console.log(`todaviaMas: ${todaviaMas}`);
}

var o = {
  algo: 1,
  todaviaMas: 2,
  algoMas: 3
};

f(o);

Supongamos que tenemos esta función:

function f({algo, algoMas, todaviaMas}) {
    //...
}

Esto sería equivalente a escribir algo así:

function f(o) {
    var algo = o.algo;
    var algoMas = o.algoMas;
    var todaviaMas = o.todaviaMas;
    //...
}

Como verás es una forma de utilizar una sintaxis mas compacta para la asignación de variables que forman parte de un objeto que se recibe como parámetro en este caso.

Ejemplo, los siguientes dos snippets hacen lo mismo:

Sin destructuring

function f(o) {
    var algo = o.algo;
    var algoMas = o.algoMas;
    var todaviaMas = o.todaviaMas;
    
    console.log(`algo: ${algo}`);
    console.log(`algoMas: ${algoMas}`);
    console.log(`todaviaMas: ${todaviaMas}`);
}

var o = {
  algo: 1,
  todaviaMas: 2,
  algoMas: 3
};

f(o);

Con destructuring

function f({algo, algoMas, todaviaMas}) {
    console.log(`algo: ${algo}`);
    console.log(`algoMas: ${algoMas}`);
    console.log(`todaviaMas: ${todaviaMas}`);
}

var o = {
  algo: 1,
  todaviaMas: 2,
  algoMas: 3
};

f(o);

Origen Enlace
Carlos Muñoz
  • 13.5k
  • 2
  • 47
  • 67

Supongamos que tenemos esta función:

function f({algo, algoMas, todaviaMas}) {
    //...
}

Esto sería equivalente a escribir algo así:

function f(o) {
    var algo = o.algo;
    var algoMas = o.algoMas;
    var todaviaMas = o.todaviaMas;
    //...
}

Como verás es una forma de utilizar una sintaxis mas compacta para la asignación de variables que forman parte de un objeto que se recibe como parámetro en este caso.

Ejemplo, los siguientes dos snippets hacen lo mismo:

###Sin destructuring

function f(o) {
    var algo = o.algo;
    var algoMas = o.algoMas;
    var todaviaMas = o.todaviaMas;
    
    console.log(`algo: ${algo}`);
    console.log(`algoMas: ${algoMas}`);
    console.log(`todaviaMas: ${todaviaMas}`);
}

var o = {
  algo: 1,
  todaviaMas: 2,
  algoMas: 3
};

f(o);

###Con destructuring

function f({algo, algoMas, todaviaMas}) {
    console.log(`algo: ${algo}`);
    console.log(`algoMas: ${algoMas}`);
    console.log(`todaviaMas: ${todaviaMas}`);
}

var o = {
  algo: 1,
  todaviaMas: 2,
  algoMas: 3
};

f(o);