A Week in JavaScript Patterns: Lazy Function Definition

Lazy Function Definition is a pattern of functional JavaScript programming, similar to Load Time Configuration. The key difference is that the final function value isn’t configured at load time, but rather upon the first invocation of the function.

The Lazy Function Definition pattern was discovered and named by Peter Michaux.

Motivation

Generally there are two main reasons for wanting to defer defining functions until a later time (although with any pattern, many other applications exist):

  1. Resources required for a function to be fully defined are not available until the page fully loads or until a user-driven event (for example, determining page scroll).
  2. The resources created by defining the function are particularly taxing and may not even be needed (for example attaching event handlers).

Implementation

The Lazy Function Definition solves these problems by defining resources upon the first invocation of the function and then redefining itself so that they are not recreated during subsequent calls. All resources are stored via closure so they remain available to the inner function (which becomes the new definition for the outer function).

var getResource = function () {
    var resource, counter;

    resource = 'foo';
    counter = 0;

    getResource = function () {
        return resource + ' has been accessed ' + (++counter) + ' times';
    };

    return getResource();
};

In the code above, a getResource function is defined. When the function is called the first time, resource and counter are created to store important information which is needed in future calls to getResource.

The function which immediately follows redefines the original getResource function, but because resource resource and counter are defined in the same scope as the inner function, they remain available.

Finally, the new getResource is executed and it’s value is returned. Now any future calls to getResource will use the inner function.

Conclusion

The Lazy Function Definition pattern allows for deferred function definition as well as insuring that resources that only need to be created once, are created once.

Posted on August 21st, 2008 in Code, Design Patterns, JavaScript | No Comments »

« Previous

From the Archive

A Week in JavaScript Patterns: The Module

The Module is a brilliant design pattern which demonstrates the elegance of the JavaScript language by exploiting closure (one of JavaScript’s most powerful features) to create private members. The Module makes use of Self-invocation making it useful as an application wrapper.
This pattern was originally discovered and named by Douglas Crockford.
Motivation
By default, there is no natural [...]

August 19th, 2008. Continue »

A Week in JavaScript Patterns: Load Time Configuration

Load time configuration is the process where a JavaScript application configures itself as it is being loaded. This pattern is most commonly found in libraries in which they configure themselves at load time to be optimized for a particular browser.
Load time configuration is also known as load time branching.
Motivation
The primary motivation behind load time configuration [...]

August 18th, 2008. Continue »

A Week in JavaScript Patterns: Self-invocation

I would like to begin this series of posts with one of the most useful and commonplace patterns in my code. Arguably, this can be considered a feature of the JavaScript language rather than a design pattern; however, when considering the contexts in which it is applied, I regard it as a pattern.
Self-invocation (also known [...]

August 17th, 2008. Continue »

Site Stuff

Pages

Projects

Archives

Categories