Write Higher Order Arrow Functions JS Challenge

JavaScript
1

Tell us what’s happening:
I don’t understand what this challenge wants me to do? If am not allowed to make loops then how do I check the array if it’s positive and whole or not?

Your code so far


const realNumberArray = [4, 5.6, -9.8, 3.14, 42, 6, 8.34];
const squareList = (arr) => {
  "use strict";
  // change code below this line
  const squaredIntegers = (realNumberArray>0 && realNumberArray%1===0)=> realNumberArray*realNumberArray;
  // change code above this line
  return squaredIntegers;
};
// test your code
const squaredIntegers = squareList(realNumberArray);
console.log(squaredIntegers);

Your browser information:

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

Link to the challenge:
https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/es6/write-higher-order-arrow-functions/

2

Higher order functions allow you to express complex functionality very succinctly, the two we’re interested in here is map and filter

filter can give you only the elements that satisfy a certain property

map can apply a function to every element

You’re meant to use these instead of loops, and they can express the same functionality in very short expressions

Note that these take functions as arguments, hence why they’re referred to as higher order functions

See the MDN page on array.prototype.filter etc for more details

1 Like
3

Thank you. I’ll try again.

4

Hi again.
I wrote this now and am not passing the tests
-function keyword not used (not using it)
-the output doesn’t match
squaredIntegers should be [16, 1764, 36]
Please help

const realNumberArray = [4, 5.6, -9.8, 3.14, 42, 6, 8.34];
const squareList = (arr) => {
  "use strict";
  // change code below this line
  const squaredIntegers = arr.filter((val)=>val>0 && val%1===0 val*val);
  // change code above this line
  return squaredIntegers;
};
// test your code
const squaredIntegers = squareList(realNumberArray);
console.log(squaredIntegers);
5

You’ve misunderstood how to use map and filter only a little

The filter you’ve used is nearly right, but what’s that val*val doing there?

You probably intended to map over the result of filter, to do this you can either make an intermediate variable to store it in, or can chain it like this: arr.filter(...).map(...)

Remember, filter takes in a function that returns something truthy or falsy representing whether we should keep an element or not, while map takes in the function we want to directly apply to the elements

1 Like
6

Done. Thank you so much.
How does this look?

const realNumberArray = [4, 5.6, -9.8, 3.14, 42, 6, 8.34];
const squareList = (arr) => {
  "use strict";
  // change code below this line
  const num = arr.filter((val)=>val>0 && val%1===0);
  const squaredIntegers = num.map((sq)=>sq*sq);
  // change code above this line
  return squaredIntegers;
};
// test your code
const squaredIntegers = squareList(realNumberArray);
console.log(squaredIntegers);
7

Looks pretty good to me

I’d probably chain the functions personally, but it doesn’t really matter

Gratz on figuring it out so quickly, higher order functions is probably the hardest thing to understand up to this point in the curriculum

Happy coding!

8

I did chain them, sir. But the console just won’t accept it. I don’t understand why. :frowning_face:

const squaredintegers = arr.filter((val)=>val>0 && val%1===0).map((num)=>num*num);
9

I pasted your code into my editor and it passed all the tests. Make sure you haven’t changed some other values, and if you have to reset the editor.

Also, I highly suggest that you add some spaces to your code for readability. There are plenty of different styles, but the one I prefer would look like this:

const squaredIntegers = arr
    .filter(val => val > 0 && val % 1 === 0)
    .map(int => int * int);
1 Like
10

Thank you, sir.
I’d like to code cleaner, too. Now does continuing the code on the next line affect it in anyway? Is it always okay to do what you did here?

11

My understanding of JavaScript (someone correct me if I’m wrong) is that white space does not matter at all except for differentiating reserved keywords and variable names.

A nice clean readable function like this:

function addOne(number) {
  return number + 1;
}

could be rewritten without many spaces and still work fine.

function a(b){return b+1}

However, because white space can be inserted as we please, it’s best to have a consistent, readable style. Teams usually accomplish this with something called a “linter”, which allows you to set rules to define the coding style. Check out ESlint.

12

Thanks, I will definitely implement these .

13

Many thanks for this. I was able to arrive at the solution using filter on an intermediary variable, but I thought there might be a way to chain them together. The liberal use of white space is also news to me. Thanks for sharing this. It has helped me to see other styles than just throwing things together in the way that I understand them.