I'm trying to understand underscore's invoke() function, but I'm having trouble in a few areas. Here's the code from the annotated source:

  _.invoke = function(obj, method) {
    var args = slice.call(arguments, 2);
    var isFunc = _.isFunction(method);
    return _.map(obj, function(value) {
      var func = isFunc ? method : value[method];
      return func == null ? func : func.apply(value, args);
    });
  };

In this example:

_.invoke([[5, 1, 7], [3, 2, 1]], 'sort');
=> [[1, 5, 7], [1, 2, 3]]

I understand what is going on; however, in the source code, I don't understand the function of args. In what kind of situations would additional arguments need to be used?

I'm also new to programming, and I'm struggling with how apply is being used here. I'm guessing it's because I don't fully understand the use of invoke, namely the use of args. Still, in looking at examples provided in Mozilla's documentation, one example used Math.max.apply(*null*, numbers), so why is it being applied to value in the source code?

Note: I've read many articles on it including this, this, and this, and several other videos, but am still struggling.

I'm trying to understand underscore's invoke() function, but I'm having trouble in a few areas. Here's the code from the annotated source:

  _.invoke = function(obj, method) {
    var args = slice.call(arguments, 2);
    var isFunc = _.isFunction(method);
    return _.map(obj, function(value) {
      var func = isFunc ? method : value[method];
      return func == null ? func : func.apply(value, args);
    });
  };

In this example:

_.invoke([[5, 1, 7], [3, 2, 1]], 'sort');
=> [[1, 5, 7], [1, 2, 3]]

I understand what is going on; however, in the source code, I don't understand the function of args. In what kind of situations would additional arguments need to be used?

I'm also new to programming, and I'm struggling with how apply is being used here. I'm guessing it's because I don't fully understand the use of invoke, namely the use of args. Still, in looking at examples provided in Mozilla's documentation, one example used Math.max.apply(*null*, numbers), so why is it being applied to value in the source code?

Note: I've read many articles on it including this, this, and this, and several other videos, but am still struggling.

• javascript
• underscore.js

Share Improve this question Follow edited May 23, 2017 at 12:10 CommunityBot 111 silver badge asked Apr 1, 2016 at 16:27 TheRealFakeNewsTheRealFakeNews 8,2532424 gold badges7777 silver badges132132 bronze badges 2

• 1 The lodash docs have a better example that might explain it better – Andy Commented Apr 1, 2016 at 16:50
• You should be doing _.invoke(arrOfArrays, 'sort',function(a, b){ return a-b;}) – Bergi Commented Apr 2, 2016 at 11:09

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 7

If you check Underscore invoke docs, you see this:

Calls the method named by methodName on each value in the list. Any extra arguments passed to invoke will be forwarded on to the method invocation.

You see? All that magic with apply and args is used so you could fire that method in invoke with some arguments.

Whats the function of args?

Take a look at join array method - it joins elements into a string, and if we pass something - it would be used as a separator.

var things = ['apple', 'banana', 'mango'];

things.join('#') // 'apple#banana#mango'

So, join can take arguments. Lets use it with invoke now.

var manyThings = [ 
  ['apple', 'banana', 'mango'],
  ['pepsi', 'fanta', 'sprite'],
  ['bear', 'wolf', 'parrot'] 
];

// Pass '#' as a third argument - is like join('#')
console.log(_.invoke(arr, 'join', '#'));

// ["apple#banana#mango", "pepsi#fanta#sprite", "bear#wolf#parrot"]

We passed '#' to that join method! That's the situation when we use that additional arguments.

How it works?

var args = slice.call(arguments, 2);

We store all arguments passed to invoke, starting from third (first is a list, second is a method name). We store '#' in our manyThings case.

Every invoke argument we pass after methodName bees arguments for this methodName function.

_.invoke(obj, 'methodName', '#', 2, false, '--')
// It's like do obj.methodName('#', 2, false, '--')

Function of args - to store passed arguments to use it in the method.

Why we need apply?

When we have all that arguments, we are ready to pass them to method we have here:

var func = isFunc ? method : value[method];

You see? We took value[method] function. Somewhere deep inside this function use this. So to be able to fire that function on the right object with right this (manyThings array), we need apply. And we pass args as a second parameter to apply (in our case it's '#').

This how it works, i hope you have better understanding now.