Closure on an object

Question

I am a little confused with how the closure works on this code:

function Spy(target, method) {
 var result = {count: 0},
 oldFn = target[method];
 target[method] = function(input) {
 result.count++;
 return oldFn.apply(target, arguments);
 }
 return result;
}

So, when you assign this to a variable like

var logSpy = Spy(console, 'log')

logSpy is an object with a count property. If you were to call console.log, the overwritten function would increment the result.count value, but the result it's accessing is enclosed, correct? So how is the link made between the enclosed object and the global logSpy object? I'm guessing that the logSpy object is referencing the enclosed object because objects are passed to variables by reference? So does logSpy as an object technically not exist in the global execution context but is merely a reference to a closure?

• sg.cc: I think that's correct -- defining a function inside of a closure gives that function access to all variables in that closure. I can only speak from experience, however, I don't know the inner workings of JS.
• xersiee: "In JavaScript, the function object itself contains a non-accessible property pointing to an object containing the variables from its declaring scope." link

Answer 1

When you call Spy(console, 'log'), it does 4 things.

1. Creates a result object.
2. Set oldFn to (a reference to) console.log (or rather console['log']).
3. Sets console['log'] to a new function that "closes" around result and oldFn.
4. Returns (a reference to) result.

So, what's happening is that console.log is now a new function, but result and oldFn still exist in memory - they have not been garbage collected yet - because there is a reference to them in that new function.

When you call console.log it updates the count property of the result object (which you have a reference to as logSpy) and then calls the "backed-up" oldFn function with the right context/parameters.