I don't understand Use Destructuring Assignment to Pass an Object as a Function's Parameters

I don't understand Use Destructuring Assignment to Pass an Object as a Function's Parameters
0

#1

Tell us what’s happening:
The code is working, but there are parts that I don’t understand. I’ve got my mind around the destructuring part, take max and min from stats and use them as variables, but I don’t get the code around it.

First I’m setting up a const named half, and then I’m returing a function called half. The code runs fine if I change the name of the function, so are the two 'halve’s not connected with eachother?

I there some recommended reading for functions calling functions returning functions? :stuck_out_tongue:

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
};
const half = (function() {
  "use strict"; // do not change this line

  // change code below this line

  return function half ({max,min}) {
    // use function argument destructuring
    return (max + min) / 2.0;
  };
  // change code above this line

})();
console.log(stats); // should be object
console.log(half(stats)); // should be 28.015

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/68.0.3440.106 Safari/537.36.

Link to the challenge:
https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-pass-an-object-as-a-functions-parameters


#2

:thinking: I do not understand how your question has to do with the challenge. As you put it, it must have worked.

On the other hand, the way FCC presents challenges (functions within functions) are common practices of developers, such as assigning the value of a function.


#3

You’re right in that the code is working. But until now I’ve been able the grasp the code around “the thing that I changed” too. I feel like I should know what’s going on here but I’m missing something.

But maybe I should just move on, I’ll probably run into it again in the future for a new chance to learn. :slight_smile:


#4

Ah, you don’t technically need that function that wraps it, it is there more for the tests. In reality, you’re likely to just write code that uses the inner part. I’m on a phone at the minute so I can’t double check this, but I think you’ll find that the tests will pass if your solution is just

function half ({max,min}) {
  return (max + min) / 2.0;
};

Having it wrapped in that outer function makes it easier from the PoV of the person writing the tests; a lot of the ES6 stuff is written this way. In ES6, a module a. has its own scope and b. always executes as if there is a use strict statement. In the tests, it’s just that function, there’s no module, so the code has been written to emulate there being a module. Basically, read it as if the stuff that wraps the code is just there as an implementation detail, there to ensure the tests work, and it’s the stuff inside that is the bit you concentrate on.


#5

For

to get value you call anonymous function which parameter is object stats. Twist: when you pass an object, in return you’re taking only two things, min and max. Imagine if someone gave you basket of fruits, you take it and ate only two apples. You still got basket and rest of fruits. Back on subject: Then you return that expression with division.
Summary: You take whole object, but you use only two properties you need.


#6

Your code runs (after you deleted that first ‘return’ :wink: ) . I think I should read up a bit more abount anonymous functions.


#7

If you want a deep dive into it, this is a good short book:

https://addyosmani.com/resources/essentialjsdesignpatterns/book/

JS didn’t used to have modules, which are a way of organising code, keeping different parts isolated. And to emulate modules, you can use anonymous functions to wrap bits of your code. ES6 modules are much simpler - 1 file is 1 module - but in the case of the tests here, they can’t be used, so you see this pattern of anonymous functions used to wrap up each of the challenges


#8

Thank you! I’ve got a long climb ahead of me, but a supportive community makes everything easier.


#9

Just google “anonymous functions” and you’ll find various examples of implementations.