Passing functions around Javascript

Passing functions around
You can, for example, do something like this:


function say(word) {
console.log(word);
}

function execute(someFunction, value) {
someFunction(value);
}


execute(say, “Hello”);
Read this carefully! We pass the function say as the first parameter to the execute function. Not the return value of say, but say itself!

Thus, say becomes the local variable someFunction within execute, and execute can call the function in this variable by issuing someFunction() (adding brackets).

Of course, because say takes one parameter, execute can pass such a parameter when calling someFunction.

We can, as we just did, pass a function as a parameter to another function by its name. But we don’t have to take this indirection of first defining, then passing it – we can define and pass a function as a parameter to another function in-place:


function execute(someFunction, value) {
someFunction(value);
}


execute(function(word){ console.log(word) }, “Hello”);
We define the function we want to pass to execute right there at the place where execute expects its first parameter.

This way, we don’t even need to give the function a name, which is why this is called an anonymous function.

This is a first glimpse at what I like to call “advanced” JavaScript, but let’s take it step by step. For now, let’s just accept that in JavaScript, we can pass a function as a parameter when calling another function. We can do this by assigning our function to a variable, which we then pass, or by defining the function to pass in-place.

Javascript Array functions

document.write(“Sort function
“);

var myarray = [20, 2, 10, 1, 3];
myarray.sort(
function(a,b)
{
return a-b;
}
);

document.write(myarray.reverse());

document.write(“
Splice function
“);

var myarray1 = [1, 2, 5];
myarray1.splice(2, 0, 3, 4);
document.write(myarray1);

document.write(“
Array filter – callback function
“);

var myarray2 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

//to filter out all the even, a call back function is required
function isEven(value, index, array) {
return (value %2==0)?true: false;
}

myarray2= myarray2.filter(isEven);
document.write(myarray2);

document.write(“
Array filter – anonymous function
“);

var myarray3 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

myarray3 = myarray3.filter(
function (value, index, array)
{
return (value % 2 == 0);
}
);
document.write(myarray3);

document.write(“
Remove duplicate string
“);

var myarray4 = [“Sam”, “Mark”, “Tim”, “Sam”, “Tim”];

//the anonymous function will check the index occurances
myarray4 = myarray4.filter(
function(value, index, array)
{
return array.indexOf(value) == index;
}
)
document.write(myarray4);

Why Javascript on ASP.NET

client side vs server side

Javascript runs on the client machine. The event handling is done on that clients machine without talking to the server.

ASP.NET code behind event handling is done on the server. When an event happens the client talks to the server, the server handles the event and talks back to the client.

The latter requires a round trip over the network and most likely a page postback (unless it’s an async webmethod).

Doing it with JavaScript means it’s done locally without the page refreshing, it’s done faster and there less stress on the server.

Of course if your event handling is manipulating the database then it should be handled by the server. If it’s manipulating the page it should be handled by the client.