Q:

Hard to explain JavaScript issue about the scope of "this"

Sorry for the title, but it's really hard to put a title on this issue (feel free to suggest a better one). 
My issue is best explained via this JsFiddle: http://jsfiddle.net/ryLhcn4q/2/
CS = {};

CS.OverviewController = {
    foo: "bar",

    render: function() {
        console.log("Rendering.  foo = " + this.foo);
    }    
};

CS.handleClick = function(callback) {
    console.log("handleClick");

    if (callback) {
        callback();
    }
};

$("button").click(function(e) {
    CS.handleClick(CS.OverviewController.render);
});

If you click on the button, the console indicates that the value of foo is undefined.  How can I have the correct scope of this, so that the console indicates bar as the value for foo? 

A:

You should use
CS.handleClick(CS.OverviewController.render.bind(CS.OverviewController));

.bind defines the context of the function.  Or in other words it sets its this object to something. 
Your example doesn't work because you refer a function out of its context.  The this points to the global scope (i.e. the window object).  So:
window.foo = 'global';
$("button").click(function(e) {
    CS.handleClick(CS.OverviewController.render);
});

will output global -> jsfiddle

