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

JavaScript
1

Tell us what’s happening:
Describe your issue in detail here.

Your code so far

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

// Only change code below this line
const half = (stats) => (stats.max + stats.min) / 2.0; 
// Only change code above this line

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/108.0.0.0 YaBrowser/23.1.1.1138 Yowser/2.5 Safari/537.36

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

Link to the challenge:

On this site, there is no explanation on this topic on programming, or does it depend on the code?

2

From the challenge page:

This effectively destructures the object sent into the function. This can also be done in-place:

const profileUpdate = ({ name, age, nationality, location }) => {

}

When profileData is passed to the above function, the values are destructured from the function parameter for use within the function.

Use destructuring assignment within the argument to the function half to send only max and min inside the function.

Does this not explain exactly what destructuring assignment is and what you need to do for this challenge?

3

No, because it is not clear why it is needed and where it should be applied, and how to understand it? Here on the forum everyone wants specifics, but how to specifically explain, if it is not clear from the material presented, you have a very strange position here.

4

The topic of Destructuring Assignment is covered in the following challenges (the final one of which you posted about):

Untitled
Untitled982×555 37 KB

These challenges appear to cover this concept fairly thoroughly, though sometimes there can be sticking points…
Can you explain exactly what it is that you’re struggling to get your head around? It’s not uncommon to get stuck on certain programming concepts… I struggled with recursion for a few days for instance.

Another good approach is to find other articles which may explain it in a different way:

5

If you do not explain what it is you do not understand, no one can explain it to you.

const user = {
  id: 1,
  name: 'John',
  age: 30,
  email: 'john@test.com',
}

// destructuring the properties from the user object
const { id, name, age, email } = user;
console.log(name); // John

Let’s say you have a function to check the age.

const checkAge = (user) => user.age >= 18 ? true : false;
console.log(checkAge(user)); // true

If you just need the age property of the user object you can use destructuring in the parameter list.

const checkAge = ({ age }) => age >= 18 ? true : false;
console.log(checkAge(user)); // true

Which is the same as doing this.

const checkAge = (age) => age >= 18 ? true : false;

const { age } = user;
console.log(checkAge(age)); // true

For docs I would suggest MDN

There is also javascript.info which usually does a pretty good job.

6

Of course, not much became clear, only where to use it in practice and why is not yet known.

7

There isn’t just one use or reason for using destructuring.

It is a convenient syntax and using it can also improve code readability. You use the syntax because it is useful. It is used a lot in JS code so it is obviously useful syntax, even if you do not yet see it. You need to use it to see its usefulness.

It is like asking why you would use forEach when we already have normal for loops. You use a forEach because it is less error-prone and gives cleaner code, not because you can’t do the same thing using a for loop.

8

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