Destructure object and reassign to different variable name in one go

I have an object:

let obj = {
  "t":
    {
      "en": {
        "head" :"hello",
        "sub"  : "this is great"
      }
    }
  "link": {}
}

and I'm destructuring it:

{ t: { en }}

is it possible to reassign t to en in the same destructuring statement?

So I want the object assigned to en in the variable t not in en

3 answers

  • answered 2018-10-11 19:16 CertainPerformance

    No, it's impossible to reassign t, because t is a const. If t weren't a const, then yes, it would be possible to reassign it:

    let t = {
      "en":
        {
          "head": "hello",
          "sub" : "this is great"
        }
    };
    
    ({ en: t } = t);
    console.log(t);

    Note that

    { t: <something>
    

    would only be done with destructuring if t were a property of the parent object - but here, t is a standalone variable, not a property so instead, start with

    { en: <something>
    

    with t on the right-hand side.

    If t actually is a property of the parent object, then you can do the same sort of thing:

    let obj = {
      "t":
        {
          "en": {
            "head" :"hello",
            "sub"  : "this is great"
          }
        },
      "link": {}
    };
    const { t: { en: t } } = obj;
    console.log(t);

  • answered 2018-10-11 19:43 Willem van der Veen

    You could do this in one line in the following manner:

    let obj = {
      "t":
        {
          "en": {
            "head" :"hello",
            "sub"  : "this is great"
          }
        }
    }
    
    // here we are destructuring en but declaring 
    // it as a variable which is called t
    let { en: t } =  obj.t;
    
    console.log(t)

    We can choose an alias in a destructuring assignment using a colon.

  • answered 2018-10-11 21:08 Barmar

    When you're destructuring an object, you can specify propname: variablename to assign the property to a variable with a different name. Putting just the property name without a variable is equivalent to propname: propname, to use the same name for the variable and property, but you don't need to use that shortcut.

    So you can do it like this:

    let obj = {
      "t":
        {
          "en": {
            "head" :"hello",
            "sub"  : "this is great"
          }
        }
    }
    
    let { t: { en: t } } = obj;
    console.log(t);

    The first t: is just a property name, it specifies that the value is an object which needs to be destructured as well. In that structure, we use the propname: variablename syntax, so the en property is assigned to the t variable.

    In a function definition this would look like:

    const Home = ({ t: { en: t }, link}) => console.log(t);
    
    let obj = {
      "t":
        {
          "en": {
            "head" :"hello",
            "sub"  : "this is great"
          }
        }
    };
    Home(obj);

    Note that there's no actual relationship between the two uses of t. The variable can actually be anything, e.g.

    const Home = ({ t: { en: blah }, link}) => console.log(blah);