Tag: functional

Understanding JavaScript Closures

In JavaScript, a closure is a function to which the variables of the surrounding context are bound by reference.

function getMeAClosure() {
    var canYouSeeMe = "here I am";
    return (function theClosure() {
        return {canYouSeeIt: canYouSeeMe ? "yes!": "no"}; 
    });
}

var closure = getMeAClosure();
closure().canYouSeeIt; //"yes!"

Every JavaScript function forms a closure on creation. In a moment I’ll explain why and walk through the process by which closures are created. Then I’ll address some common misconceptions and finish with some practical applications. But first a brief word from our sponsors: JavaScript closures are brought to you by lexical scope and the VariableEnvironment…

Continue reading “Understanding JavaScript Closures” →

No ifs…alternatives to statement branching in JavaScript

You could do this..

//Example 1
function getEventTarget(evt) {
    if (!evt) {
    	evt = window.event;
    }
    if (!evt) {
    	return;
    }
    var target;
    if (evt.target) {
        target = evt.target;
    } else {
        target = evt.srcElement;
    }
    return target;
}

or you could do this…

//Example 2
function getEventTarget(evt) {
    evt = evt || window.event;
    return evt && (evt.target || evt.srcElement);
}

Continue reading “No ifs…alternatives to statement branching in JavaScript” →

dipping into wu.js: autoCurry

It’s my pleasure to welcome our first guest blogger: Nick Fitzgerald is the author of the excellent wu.js “a lazy functional programming library”. It’s an inspiring resource with a lot of really original touches and very nicely written. Take it away Nick….

One of my favorite functions in my newly released wu.js library is wu.autoCurry, a function that takes a function and returns (you guessed it) a curry-able version of that function.

I am going to assume you are familiar with currying from here on out. If you aren’t yet, check out the Wikipedia article on currying for a general overview, and Angus’ piece on currying in Javascript for a detailed explanation in our current language.

Some languages, notably Haskell, automatically provide currying to the user. If you don’t pass all the arguments to a function, it is implied that a new function that will take the rest is returned. In Javascript, we don’t have that luxury. We are forced to write explicit, boilerplate code every time we want to curry a function.

Continue reading “dipping into wu.js: autoCurry” →

JavaScript Partials

In a previous post I introduced the curry function. To recap, currying creates a new function with the first n arguments pre-assigned:-

var subtract = function(a,b) {
    return a - b;
}

var subtractFrom8 = subtract.curry(8);

subtractFrom8(2); //6

Currying is an expressive and compact alternative to manually wrapping anonymous functions. I use it a lot. But sometimes its not enough – the problem is you can only pre-assign the first n arguments. What if we wanted to make a function and pre-assign the rightmost argument, or maybe the middle two? Enter partial:-

var subtract5 = subtract.partial(___,5);

subtract5(13); //8;

Continue reading “JavaScript Partials” →