//Code starts
var self = this;
var a=10;
function myFunc(){
this.a = 4;
var a = 5;
console.log("this.a -> " + this.a); //Output: this.a -> 4
console.log("self.a -> " + self.a); //Output: self.a -> undefined
console.log("a -> " + a); //Output: a -> 5
}
myFunc();
//Code ends
Can someone please explain the Output of the above console.log statements. Thank You.
In Javascript, every scope level has a this. When you save this in the var self outside of any function (top level), it gets the window object. So the first this (stored in self) is different from the one in the function. No property "a" was defined on the top level, so self.a is undefined.
Now there is a difference between a variable (var) and a propery (obj.prop). The first one will be resolved from scopes (if a is not defined in the current scope, it will search if it is defined in higher scopes, until it finds window where "global vars" are, and comes undefined if still not found). The second one will search the property through the prototype chain.
console.log("this.a -> " + this.a); //Output: this.a -> 4
The this keyword refers to the object the function belongs to, or the window object if the function belongs to no object. That said you created a varaible a on top and updated that inside the function. Thus 4
console.log("self.a -> " + self.a); //Output: self.a -> undefined
No. self referring to window and window have variable a. It should print 4. Check again.
console.log("a -> " + a); //Output: a -> 5
That a= 5 shadowed your global variable a declared outside function. You accessed the more specific variable. Local variable have more specific.
I tried the code, self.a also is coming as 4, which is fine.
this.aandaare different object