CODEWITHSUNDEEP
javascriptjqueryfunctiondelegates
Benjamin
Benjamin

Reputation: 3234

How do I pass a function(delegate?) as a parameter to another function in Javascript and then use it

I want to pass a function to another function. I think functions being passed like that are call delegates? I am having a hard time finding a good explanation for this kind of thing online. Is this the right way to do this? 

function getCellContentByColumnIndex = function(row, index) {
    return $(row.children().get(index)).text();
}
function naturalSort(a, b, func) {
    //...
    var $a = func(a);
    var $b = func(b);
    //...
}

//usage  
naturalSort(x, y, getCellContentByColumnIndex);

Upvotes: 3

Views: 11101

Answers (4)

RobG
RobG

Reputation: 147413

Your code:

function getCellContentByColumnIndex = function(row, index) {
    return $(row.children().get(index)).text(); 
}

Is a syntax error. The following is a function declaration:

functon foo() {}

And this is a function expression:

var foo = function(){}

And this is a named function expression:

var foo = function bar(){}

There are a number of answers here on the differences, there is a detailed explanation in the article Named function expressions demystified which also covers many other aspects of function declarations and expressions.

The term "anonymous function" is jargon for a function expression that has no name and isn't assigned to anything, e.g.

someFn( function(){...} )

where someFn is called and passed a function that has no name. It may be assigned a name in someFn, or not. Ic could just be referenced as arguments[0].

Passing a function is not delegating, that is jargon for the practice of putting a listener on a parent element and catching bubbling events, it is preferred in cases where it can replace say a click listener on every cell in a table with a single listener on the table.

Anyhow, passing a function is just like passing any other object:

function foo(){
  alert('foo');
}

function callIt(fn) {
  fn();
}

callIt(foo);  // 'foo'

In the above, foo is passed to callIt and assigned to the local variable fn, and is then called.

Upvotes: 7

U.P
U.P

Reputation: 7442

In JavaScript, functions are treated as first class citizens which mean you can toss them here and there like simple variables. The key is, use the FunctionName when you want to refer to function and use FunctionName() to invoke it.

this line: naturalSort(x, y, getCellContentByColumnIndex);

could have been written as 

naturalSort(x, y, function (){
    return $(row.children().get(index)).text();
});

In which case it would have been called passing Anonymous Function

Upvotes: 1

Tom Walters
Tom Walters

Reputation: 15616

You pass functions around as variables like so:

var getCellContentByColumnIndex = function(row, index) {
    return $(row.children().get(index)).text();
}

function naturalSort(a, b, func) {
    //...
    var $a = func(a);
    var $b = func(b);
    //...
}

//usage  
naturalSort(x, y, getCellContentByColumnIndex);

This is called using anonymous functions.

Upvotes: 4

Rajat Singhal
Rajat Singhal

Reputation: 11264

Anonymous functions..

var getCellContentByColumnIndex = function(row, index) {
    return $(row.children().get(index)).text();
}

will work..rest stuff of calling is already perfect in your code..:)

Upvotes: 2

Related Questions