Write higher order arrow function: dont get hint answer

I am trying to do the challenge for write higher order functions and when i got stuck and checked the answer, i did not get it. First of all where did they get(or declare) the num variable and how does the code know that “num” is referring to the numbers in the array?
Link for the challenge: https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/es6/write-higher-order-arrow-functions

const squareList = (arr) => {
“use strict”;
const squaredIntegers = arr.filter( (num) => num > 0 && num % parseInt(num) === 0 ).map( (num) => Math.pow(num, 2) );
return squaredIntegers;
};

// test your code
const squaredIntegers = squareList(realNumberArray);
console.log(squaredIntegers);
2 Likes

.filter() is essentially an anonymous parameter function. num would be the name of your parameter which could be used inside of your code block

 (num) => {
      return  num > 0 && num % parseInt(num) === 0 
}

ES6 arrow functions can be shorthand typed in such a matter that it maybe a bit confusing compared to your old, vanilla javascript functions

function(num) { 
       return  return  num > 0 && num % parseInt(num) === 0 
}
1 Like

All of the higher order array methods are well documented in the MDN. Especially of interest are the first two sections of each doc - a brief description of the method followed by a syntax detail. The syntax section clarifies which parameters will be passed to your callback function (and in what order).

That said, here’s what’s happening …

There is a “contract” between the filter method and the function you pass to filter. Filter will pass three parameters to your function for each element of the array - the current element, the index of current element and the entire array. All three get passed whether you use them or not.

In this case you are using only the first parameter - the element - which you are giving a local name of “num” inside your callback function. You can name it anything you want - I usually use “el” for element

Consider this example filter code

const arr2 = [-10,75,80,95,20,25]

// filter evens
const evens = arr2.filter((el, ind, ar) => {
	// console.log(`element:${el}  index:${ind}  array:`, ar);
	return el % 2 === 0 && el !== 0;
});

If you uncomment the console statement you will get output like below showing that all three parameters were passed

element:-10  index:0  array: [ -10, 75, 80, 95, 20, 25 ]
element:75  index:1  array: [ -10, 75, 80, 95, 20, 25 ]
element:80  index:2  array: [ -10, 75, 80, 95, 20, 25 ]
element:95  index:3  array: [ -10, 75, 80, 95, 20, 25 ]
element:20  index:4  array: [ -10, 75, 80, 95, 20, 25 ]
element:25  index:5  array: [ -10, 75, 80, 95, 20, 25 ]
1 Like

If you’re still confused, this youtube vid helped me bigtime: https://www.youtube.com/watch?v=rRgD1yVwIvE

3 Likes

Thanks so much. This video was so helpful!!! Just solved this problem after being completely stuck :slight_smile: