ES6 - Use Destructuring Assignment to Pass an Object as a Function's Parameters

I can see, and I do understand that the object key’s from the stats object–those of “max” & “min”–are being used as parameters in the arrow function below… however, I am completely confused as to how that can be happening in this case, being that all previous examples for destructuring an object–including this challenge–explain destructuring an object, by pointing to the object being accessed.

// I would expect something like this, though its likely wrong...
const half = ( { max, min } = stats ) => (max + min) / 2.0

const stats = {
  max: 56.78,
  standard_deviation: 4.34,
  median: 34.54,
  mode: 23.87,
  min: -0.75,
  average: 35.85
};

// instead, this is the solution. No stats object pointed to?!?!
const half = ({ max, min }) => (max + min) / 2.0; 

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:109.0) Gecko/20100101 Firefox/115.0

Challenge: ES6 - Use Destructuring Assignment to Pass an Object as a Function’s Parameters

Link to the challenge:

Ya, it’s a little confusing that the starter code uses the name stats for both the example object and the parameter name for the function. They are different things. In the starter code for the half function, instead of using stats for the parameter name, think of it as using just s:

const half = (s) => (s.max + s.min) / 2.0; 

The tests might be passing the stats object defined above the function, but it doesn’t have to, it could use an object with a different name. The name of the object being passed into the function doesn’t matter because it assumes the name used as the parameter arg inside the body of the function. Same thing happens if you use destructuring.

Hi bbsmooth,

Cheers for the support and for helping out with my attempt to grasp this. I do appreciate it. I do–unfortunately in this case–have more questions. In your description you show the arrow function example…

const half = (s) => (s.max + s.min) / 2.0;

This makes sense to me. This method refers to the object “s” and the extracted object keys are s.max & s.min all referring back to the object s as well. In the solution that I posted, however, the destructured object is never referred to like this or in any way.

Since one could easily have multiple objects in their code, each object using some of or all of the same key names as key value pairs, how would this method distinguish?

…meanwhile

I searched and got some more info from stack overflow…

It appears that in this case the object is not just being destructured it is also being anonymized. it’s not until you call the method half(stats) or half(whatEverObjectHoldsThoseKeys) that it passed those object keys as function parameters.

That makes sense to me. And also now that I FINALLY go back and look “more closely” in the Tests output of the challenge, it does say in there to call half(stats).

Thank you for the help. Apologies if it seems like I used your help as a sounding board. It actually just encouraged me to try and figure it out while I was typing this damned response.

  • Cheers
const half = ( { min, max } ) => (max + min) / 2.0;

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.