Name thy variables while destructuring arguments

Destructuring is useful but what if you have conflicts with the variable names provided by the object being imported?

Consider the following example where we destructure arguments of a function.

const getSum = nums => {
  let { x, y } = { ...nums };
  return x + y;
};

console.log(getSum({ x: 1, y: 9 }));

//10

We can get into a pickle if the function already has a variable x. Well, not exactly in the above example but in a real world program that tends to have a hundred lines of code, and interact with a thousand other components.

One of the ways of avoiding the conflict is by using named arguments while destructuring the input - provide an alias during the destructuring.

const getSum = nums => {
  let { x: xIn, y: yIn } = { ...nums };
  return xIn + yIn;
};

console.log(getSum({ x: 1, y: 9 }));

//10

During destructuring we specify the name of the function-specific variable that stores the value provided in input. The function will use this new variable while the original variable continues to be available within the object.