Question

While going through Eloquent Javascript (Chapter 6) there is a reference to higher-order functions in Javascript. While there is an example provided in Chapter 3, I believe it could be a bit simpler since I still don’t fully understand the concept. After searching the web I can’t seem to find any succinct examples of a higher-order function.

I’d like to see a basic/simple higher-order function in Javascript that will explain the concept.

Answer 1

Higher functions are concepts from functional programming. In briefly, a higher function is a function which takes another function as parameter. In javascript, some higher functions are added recently.

Array.prototype.reduce 
//With this function, we can do some funny things.
function sum(array){
    return array.reduce(function(a, b){ return a + b; }, 0);
}

So, in the above sample, reduce is a higher order function, it takes another function, the anonymous function in the sample, as a parameter. The signature of reduce looks like this

reduce(func, init);
//func is a function takes two parameter and returns some value.
// init is the initial value which would be passed to func
//when calling reduce, some thing happen

//step 1.
[1, 2, 3, 4, 5].reduce(function(a, b){ return a + b }, 0);
//step 2.
[2, 3, 4, 5].reduce(function(a, b){ return a + b}, 0 + 1);
//step 3.
[3, 4, 5].reduce(function(a, b){ return a + b}, 0 + 1 + 2);
//...

As you can see, reduce iterate an array, and apply the func with init and first element of that array, then bind the result to init.

Another higher order funciton is filter.

Array.prototype.filter
//As the name indicates, it filter out some unwanted values from an Aarry. It also takes a function, which returns a boolean value, true for keeping this element.
[1, 2, 3, 4, 5].filter(function(ele){ return ele % 2 == 0; });

With the above two examples, I have to say higher order function is not that much easy to understand, especially reduce. But that’s not complex, with higher order function, actually your code would be more clean and readable. Take the filter as example, it tells people that it throws all odd numbers away.

Here I’d like to implement a simple filter function to show you how.

function filter(array, func){
    var output = [];
    for(var i = 0; i < array.length; i++){
      if(func(array[i])) output.push(array[i]);
    }
    return output;
}