Elementary OO Javascript and prototyping I
Considering the apparent fact that everything in Javascript is an object to be another day's story we will learn what is object oriented javascript.
a) Object declaration.
The first is a literal object and the second is a constructor object.
The literal object is used when the same object is used throughout and any changes to the object will be carried forward.
The constructor object is used when multiple instances of the object are required with some initial work is already done during object declaration.
b) Method and Property declaration.
N.B.: Changing properties and methods of foo will not change it in Foo
c) this confuses me
1) this of constructor object refers to parent object(In this case window)
2) this of constructor object refers to self
1) this of constructor object refers to literal object(In this case foo)
2) this of constructor object refers to literal object(In this case foo)
N.B.: 1. In a browser - this references the window object
2. Inside a literal object - this will refer to the object itself.
3. Inside a function - this will refer to the window object.
4. Inside a method that is inside an object - this will refer to the object.
5. Inside an object that is inside an object - this will refer to the child-object and not the parent object.
NEXT POST
a) Object declaration.
var foo={}; | function Foo(){}; |
The first is a literal object and the second is a constructor object.
The literal object is used when the same object is used throughout and any changes to the object will be carried forward.
The constructor object is used when multiple instances of the object are required with some initial work is already done during object declaration.
b) Method and Property declaration.
var foo={ bar : "foobar", getName : function(){ return this.bar; } }; alert(foo.getName()); // will display - foobar | function Foo(){ this.bar = "foobar"; this.getName = function(){ return this.bar; } } var foo = new Foo(); alert(foo.getName()); // will display - foobar |
N.B.: Changing properties and methods of foo will not change it in Foo
c) this confuses me
function foo(){ alert(this); } foo(); // will display - window | function foo(){ alert(this); } var foobar = new foo(); // will display - object |
1) this of constructor object refers to parent object(In this case window)
2) this of constructor object refers to self
var foo = { bar : function(){ alert(this.foobar); }, foobar : "foobars" } foo.bar(); will display - foobars | var foo = { bar : function foofoo(){ alert(this.foobar); this.fooBarFunc(); this.fooFunc = function(){ this.fooBarFunc(); }; }, foobar : "foobars", fooBarFunc : function(){ alert(this.foobar); } } foo.bar(); will display - foobars(twice) |
1) this of constructor object refers to literal object(In this case foo)
2) this of constructor object refers to literal object(In this case foo)
var foo = { bar : function foofoo(){ alert(this.foobar); // this of constructor object
refers to self
this.fooFunc = function(){ this.fooBarFunc(); }; }, foobar : "foobars", fooBarFunc : function(){ alert(this.foobar); } } var fooo = new foo.bar(); // will display - undefined fooo.fooFunc(); // will not execute because of exception
N.B.: 1. In a browser - this references the window object
2. Inside a literal object - this will refer to the object itself.
3. Inside a function - this will refer to the window object.
4. Inside a method that is inside an object - this will refer to the object.
5. Inside an object that is inside an object - this will refer to the child-object and not the parent object.
NEXT POST
Comments
Post a Comment