the Future of the Web
  • Home
  • Hire Us
  • Articles
  • About
  • Contact
  • JavaScript Functions are Variables

    Dec 29 2007

    JavaScript functions are variables, and this is a big difference between JavaScript and many other programming languages. It can be a bit of a paradigm shift for people new to JavaScript, but it allows for some really cool things you can't do in many other languages.

    When I say functions are variables, I mean that they're treated much the same as arrays, numbers, strings and objects. That means you can do some neat things.

    You can define and redefine functions as local variables:

    var myFunc;
    
    if (Math.random() < 0.5) {
        myFunc = function() {
            alert('heads');
        };
    } else {
        myFunc = function() {
            alert('tails');
        };
    }
    
    myFunc(); // alerts "heads" or "tails" depending on random value
    

    You can also pass functions as parameters to other functions, which is very useful for callback functions:

    function do_something(callback_function) {
        alert('hello');
    
        if (callback_function) {
            callback_function();
        }
    }
    
    var my_callback = function() {
        alert('goodbye');
    };
    
    do_something(my_callback); // alerts "hello" and then "goodbye"
    

    You can also return a function from a function:

    function get_multiplier(factor) {
        return function(num) {
            return num * factor;
        };
    }
    
    var times_5 = get_multiplier(5);
    var result = times_5(10);
    
    alert(result); // alerts "50"
    
    var six_times_two = get_multiplier(6)(2);
    
    alert(six_times_two); // alerts "12"
    

    You can also define "anonymous" functions without a name and even execute them:

    (function(first_name, get_last_name) {
        var last_name = get_last_name();
    
        alert(first_name + ' ' + last_name); // alerts "Jesse Skinner";
    })('Jesse', function(){ return 'Skinner'; });
    

    Note that in order to execute an anonymous function you have to wrap it in () parentheses first.

    So that's just some of the unusual stuff you can do with JavaScript. Once you get familiar with the concept, you can really start to reuse code in great new ways.

    Tags: javascript functions
    View 3 Comments | Add a comment
  • Comments

    1. nitinpai at 7:22am on January 3, 2008

    Hey Jesse,

    Aren't such functions referred to as closures?

    2. Jesse Skinner at 12:42pm on January 3, 2008

    Sure, functions can be closures if they're used to create a new scope that anchors down some variables. But I think the word closure is referring to this effect alone - surely you can do lots of other cool stuff with functions :)

    3. Veeresh at 5:56am on May 10, 2008

    Informative article, it helps allot for a static content for dynamic access.

    Thanks,

    Veeresh D.
    http://drveresh.googlepages.com

    Add a Comment

    Note: HTML tags and entities will be converted so that they are displayed as you type them. This means if you type in <em>, people will see <em>, and if you type &lt;em&gt;, people will see &lt;em&gt;.

  • Request a Quote

  • Jesse Skinner

    Jesse Skinner
    • Hire Me
    • About Me
    • Email Me
    • RSS Feed RSS Icon
  • Recent Articles

    • Parse Accept-Language to detect a user's language
    • Twitter
    • Three years of The Future of the Web
    • Saving data to a file with PHP
    • Easy web scraping with PHP
    • See all the articles
    • IBM: Where and when to use Ajax
    • Code Igniter 1.6.0 Released
    • Update a Dev Site Automatically with Subversion
    • JavaScript Functions are Variables
    • See All...
  • Categories

    • javascript (37)
    • links (19)
    • about (18)
    • web (14)
    • server (10)
    • html (10)
    • css (8)
    • carnival (7)
    • browsers (7)
    • design (4)
    • seo (4)
    • ads (4)
    • standards (4)
    • events (4)
    • work (4)
  • Older Articles

    • May 2008
    • April 2008
    • February 2008
    • January 2008
    • December 2007
    • November 2007
    • September 2007
    • August 2007
    • July 2007
    • June 2007
    • May 2007
    • April 2007
    • March 2007
    • February 2007
    • January 2007
    • December 2006
    • November 2006
    • October 2006
    • September 2006
    • August 2006
    • July 2006
    • June 2006
    • May 2006
    • April 2006
    • March 2006
    • February 2006
    • January 2006
    • December 2005
    • November 2005
    • October 2005
    • September 2005
    • August 2005
    • April 2005
    • See All...
Copyright © 2008 Jesse Skinner | CSS | XHTML | RSS | Help | Impressum | Cutie Quilts | Internet Blog Top Sites