When/why to use "return" in callback functions

Question

I am trying to understand when should we use return, and when we shouldn't.

The returns used below are confusing to me. Please see the comments for my questions:

function each(collection, iterator) {
    if (Array.isArray(collection)){
      for (var i=0;i<collection.length;i++){
        iterator(collection[i],i,collection)
      }
    }else {
      for (var key in collection){
        iterator(collection[key],key,collection)
      }
    }
  };


function map(collection, iterator) {
    var result = [];

    // why we don't add "return" in front of the each() function here? 
    // why, if I add return, is the result "undefined"? 
    each(collection,function(value,key,collection){   

      result.push(iterator(value,key,collection));
    })
    return result;
  };

  function pluck(collection, key) {
    // Why do we add "return" in front of map function, and 
    // why if I don't add it, the result is "undefined"?     
    return map(collection, function(item){  
      return item[key];
    });
  };

var car = [{type: "Fiat", model: "500", color: "white"}]    

console.log(pluck(car,'type'));

Paul Roub · Accepted Answer · 2015-12-07 23:06:47Z

Use return to have your function return a value; don't use it if the function doesn't need to return anything, or when you don't want to return yet.

In your example, if you just said:

function pluck(collection, key) {
  map(collection, function(item){  
    return item[key];
  });
};

map() would still be called, but the results of that map() would be discarded.

It's as though you'd written:

function add(a, b) {
  var c = a + b;           // computed, not returned
}

var result = add(1, 2);    // undefined

instead of:

function add(a, b) {
  var c = a + b;           // computed
  return c;                // and returned
}

var result = add(1, 2);    // 3

each() loops over a set of things, performing an action each time. It doesn't have a result to return.

And in your case, there's more code after the each() -- remember, return; ends the function from which it's returning.

// if we returned here
each(collection,function(value,key,collection){
  // this isn't part of each's "value", it's just some code
  // that runs within the each loop  
  result.push(iterator(value,key,collection));
})

// we'd never get here, to return the total result
return result;

wmock · Accepted Answer · 2015-12-07 23:04:06Z

Not exactly sure what your question is asking but I'm guessing you're comparing each versus map / pluck in the sense that each doesn't have an explicit return statement wheres map and pluck do have an explicit return statement.

A key point to note is that even though each doesn't have an explicit return statement, there is an implicit return undefined for every JavaScript function without an explicit return statement - which means that each also has an implicit return undefined.

The reason why each doesn't have a return statement is because you're NOT trying to return anything - instead, you're trying to do something to each item in a collection. For map and pluck, most libraries have defined it so that these functions are specified to return a collection.

Collectives™ on Stack Overflow

When/why to use "return" in callback functions

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related