JavaScript: All About Functions

First Class Objects

Functions within the JavaScript (JS) language are said to be “First Class Objects”, this means they are comparable to objects composed from classes in C# or Java. The difference however is that classes (object templates) do not exist in the JS language. Instead, JS objects are created through the replication of already existing prototype objects provided by the language, but this is a topic for another day. Unlike C# and Java objects, JS functions can accept parameters and contain executable code, when invoked that code can then be executed. This executable behavior is similar to methods in C# or Java, the only difference is C# or Java methods must exist within an object.

Named & Anonymous

Another feature of JS functions is that they can be either named or anonymous. Named functions receive a name by which they can be referenced at the time they are defined. Anonymous Functions on the other hand are not provided names in their definitions, instead they are assigned to a variable and referenced in that manner throughout a script.

"use strict";

// JavaScript Functions: First Class Objects
//  1. All functions in JavaScript are first class Objects
//     they do not have to exist inside an object
//  2. Functions all have Function.prototype as their Prototype Object
//  3. Unlike other Objects in JavaScript, Functions can be invoked
//  4. Functions can be stored in variables, objects, and arrays

// Named Function
// (referenced via the functions actual name)
function myFirstClassFunction(param){
    return "You passed me: " + param;
}
console.log(myFirstClassFunction("a Horse"));

// Anonymous Function
// (referenced via variable to which it is assigned)
var myAnonymousFunctionReference = function(param){
    return "You passed me: " + param;
};
console.log(myAnonymousFunctionReference("a Pillow"));

Passed as Arguments & Returned by Function

Because JS functions are objects and can be referenced they can also be passed around by reference. This means that JavaScript allows functions to be passed around a script as parameters to other functions to be used and executed by the receiving function’s executable code. Also, functions can be defined and set up by a ‘parent’ function and returned by that function as its result of execution. The passing of functions as arguments and the ability to return them is a feature of JavaScript that is not found in C# or Java. The closest thing to this in either language is a delegate, which is a special class that represents a method and can therefore be passed around.

'use strict';

// Passed as Arguments & Returned by Function
//  5. Can be passed as arguments to other Functions
//  6. Can be returned from other Functions
function iAcceptFunctionsAsParameters(param, func){
    return func(param);
}
console.log(iAcceptFunctionsAsParameters("a Bus", cool_function));


function iReturnFunctions(){
    return function (param){
        return "You passed me: " + param;
    };
}
// Obtaining reference to returned function
var returnedFunctionReference = iReturnFunctions();
console.log(returnedFunctionReference("a Bird"));

State & Behavior

In conjunction, JS functions can also have their own state (variables, data) as well as behavior (methods) to support their execution or to provide additional functionality specific to the owning function. This is very similar to C# and Java objects that receive variables and methods from the class definition from which they were created.

'use strict';

// State & Behavior
//  7. Functions are Objects and can therefore have Variables & Methods (functions) of their own
var functionWithStateBehavior = function(){
    return "I am the core functionality";
};

// Add a variable to the function
functionWithStateBehavior.state = "I am a variable property on the 'functionWithStateBehavior' function.";

// Add a method to the function
functionWithStateBehavior.behaviorMethod = function(){
    return "I am the extra Method on a Function";
};

console.log(functionWithStateBehavior());
console.log(functionWithStateBehavior.state);
console.log(functionWithStateBehavior.behaviorMethod());

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s