suppose we have this code

function largestOfFour(arr) {
  return arr.map(Function.apply.bind(Math.max, null));
}

where arr is an array of arrays.

1. first,why must i use apply()?

I understand that when using the method Math.max() to operate on an array i must add the apply() method also. So i'll have something like this Math.max.apply(null, arr) why? what does apply() do?

2. In this code arr.map(Function.apply.bind(Math.max, null)) what does bind() really do?

Please give an explanation i can understand,i really appreciate this.

suppose we have this code

function largestOfFour(arr) {
  return arr.map(Function.apply.bind(Math.max, null));
}

where arr is an array of arrays.

1. first,why must i use apply()?

I understand that when using the method Math.max() to operate on an array i must add the apply() method also. So i'll have something like this Math.max.apply(null, arr) why? what does apply() do?

2. In this code arr.map(Function.apply.bind(Math.max, null)) what does bind() really do?

Please give an explanation i can understand,i really appreciate this.

• javascript

• bind recreate the function with own properties, if you already used the event can be recreate ... etc ... – user8556290 Commented Sep 19, 2017 at 22:52

3 Answers 3

Looking at the entire expression:

arr.map(Function.apply.bind(Math.max, null));

map expects its first argument to be a function, which is returned by:

Function.apply.bind(Math.max, null);

Function.apply is a shorter version of Function.prototype.apply.

Calling bind on it returns a special version of apply whose this is set to Math.max and when called, will have as it's first parameter (i.e. the value that would normally be used as this) set to null, since it's not going to be used.

So each element in arr will effectively be called using:

Math.max.apply(null, member);

The use of apply means the values in member are passed as parameters, as if:

Math.max(member[0],member[1] ... member[n]); 

So the expression returns the maximum value in each array. Those values are returned to map, which puts them into a new array.

var arr = [[1,2,3],[4,5,6]];
console.log(
  arr.map(Function.apply.bind(Math.max, null)) //[3, 6]
);

and is effectively the same as:

var arr = [[1, 2, 3],[4, 5, 6]];
console.log(
  arr.map(function(a) {return Math.max.apply(null, a)}) //[3, 6]
);

Though using recent features you might use destructing with rest parameter syntax:

var arr = [[1, 2, 3],[4, 5, 6]];
console.log(
  arr.map(a => Math.max(...a))   // [3, 6]
);

Simply put, .apply calls a function with the set of arguments(array-like) passed to it.

EG:

const add = (...args) => args.reduce((acc, next) => acc + next);

I can call the add function with any number of arguments using the .apply method like this.

add.apply(null, [4, 2, 6, 76, 9]) // => 97.

You call also use .call but instead of passing in array-like arguments, you simply pass in the values

add.call(null, 4, 2, 6, 76, 9) // => 97.

With .bind, the difference is that it creates a new function with call be called later.

const addFunc = add.bind(null, 4, 2, 6, 76, 9);
addFunc() // -> 97.

So, as it applies to the function we defined, it also applies to inbuild functions like Math.max, Math.min, etc.

Hope this helps!

The Function.apply.bind(Math.max, null) creates a function definition when invoked takes null as the first parameter by default and any provided parameters will e second. So as a callback to arr.map this function (due to bind statement) will be bound to Math.max however the Function.apply's first parameter will be null and second is going the be the sub array item of the main array (of which the items are to be passed as arguments to Math.max function).

This is an old trick and in ES6 terms arr.map(s => Math.max(...s)); would do the same job much more clearly.