I found something very odd today: If you create objects with a constructor function and the new keyword, but return a function from the constructor, it behaves like so:
- The newly-created "object" is instead a function.
- That new function can be invoked like normal, however...
- If you maintain a reference to
thisin the constructor function,thisreferences an object that was correctly created from the constructor. It's what you expected to be returned fromnew.
Here's an example:
function Constructor() {
var self = this;
this.name = 'instance';
return function() {
return self;
}
}
So if you instantiated it like this: var instance = new Constructor() The following would result:
typeof instance //returns "function"
typeof instance() //returns "object"
instance() //returns { name: 'instance' }
So I guess I have three questions:
- Is this legal and does it work cross-browser? It's really awesome and I think it can be used in a lot of ways, but is this behavior dependable?
- What happens in the background that causes this behavior?
- (maybe answered by 2, but...) Is the new object (the one referenced with 'this') inside the new instance, so that it's all self-contained and is cleaned up properly by the garbage collector?
Source: Tips4all
Yes, while a constructor by default returns the new object being constructed (which is referenced by this), you can override that return value as long as you return an object. Because a function is an object, you can return it as you are in your example. The newly created object is not a function itself, but your returned function references the newly created object in its variable scope.
ReplyDeleteSee #1
This is because a function creates a closure, so it continues to reference the self variable, which happens to reference the actual object being constructed. So I wouldn't quite say it's "inside" anything, but rather is simply part of the variable scope of the function.
The thing to understand is that your function isn't any different from any other function. Just like if you had instead returned an Array, you'd just have a regular Array, which could reference the new object.
function Constructor() {
this.name = 'instance';
return [ this ]; // Instead return an Array that references the new object
}
Well, that is a really good question and, as you may have guessed, not easily answered.
ReplyDeleteTo put it very simply:
1) Yes and Yes; this is one of the amazing features you don't find in "traditional" programming languages.
2) please read about closures (links below)
3) Yes (please read more)
You should read more about Javascript Closures:
http://jibbering.com/faq/notes/closures/
http://www.javascriptkit.com/javatutors/closures.shtml (here you got some good working examples)
and, more particularly, the Parasitic Inheritance model:
http://blog.higher-order.net/2008/02/21/javascript-parasitic-inheritance-power-constructors-and-instanceof/
I hope this helps
this is what you call a closure
ReplyDeletewhat it does is create a self-contained code environment (commonly known as an object)
typeof instance //returns "function" - since it's not "fired" or called. just returns the function declaration (correct me if i'm wrong)
typeof instance() //returns "object" - it returns an object since you called it
instance() //returns an object also - you called it, but you didn't store it
an example of an object built using a closure:
function Constructor() {
var privateProperty = 'private';
var privateMethod = function(){
alert('called from public method');
};
//return only what's to be seen in public
return {
publicProperty: 'im public',
publicMethod: function(){
alert('called from public method');
}
getter: privateMethod //assign to call the private method
}
}
var myObj = Constructor();
var pubProp = myObj.publicProperty; // pubProp = 'im public'
myObj.publicMethod() //alert: 'called from public method';
myObj.getter() //alert: 'called from public method';
//cannot access since "private":
myObj.privateProperty
myObj.privateMethod