I wrote down these notes while watching one of Kyle Simpson workshops about javascript and would like to share them with Y'all :
"Every function, while executing, has a reference to its current execution context, called this. "
There are 4 rules of how this word gets bound in JavaScript:
"1.Was the function called with 'new' ?
2.Was the function called with 'call' or apply specifying explicit 'this' ?
3. Was the function called via a containing/owning object (context)?
4. Default : global object "
Rule 1: Default binding rule
When the call site is the default "plain" like in the lines, the function stands alone by itself. The default binding rule applies.
If you are in strict mode, then default is undefined , otherwise define it in the global.
Rule 2: Implicit binding rule
It owns the content of the call site.
Rule 3:
Explicit binding
If you use .call or .apply on the call side, They take their parameter as a this.
Hard binding
Predictably reference the object that it has to reference.
Rule 4: The new key word
There are 4 things happen when the new key word put in front of a function call
1. A brand new object will be created
2. That object gets linked to different object <---- More clarifications later
3. That object gets bound as this key word
4. If that object return nothing, It will implicitly returns this .
Example :
"Every function, while executing, has a reference to its current execution context, called this. "
There are 4 rules of how this word gets bound in JavaScript:
"1.Was the function called with 'new' ?
2.Was the function called with 'call' or apply specifying explicit 'this' ?
3. Was the function called via a containing/owning object (context)?
4. Default : global object "
Rule 1: Default binding rule
When the call site is the default "plain" like in the lines, the function stands alone by itself. The default binding rule applies.
function foo(){
console.log(this.hi);
}
foo(); <---- function stands alone by itself.
If you are in strict mode, then default is undefined , otherwise define it in the global.
Rule 2: Implicit binding rule
It owns the content of the call site.
function foo(){
console.log(this.hi);
}
var object1 ={hi:1984,func:foo};
var object2= {hi:2016,func:foo};
object1.foo(); <---- //1984
object2.foo(); <---- //2016
Rule 3:
Explicit binding
If you use .call or .apply on the call side, They take their parameter as a this.
function sayHi(){
console.log(this.hi);
}
var hi="Hola";
var object1={hi:"Hi"};
sayHi(); <----- //Hola
sayHi.call(object1); <----- //Hi
Hard binding
Predictably reference the object that it has to reference.
function sayHi(){
console.log(this.hi);
}
var object1 ={hi:"Hi"};
var object2 ={hi:"Hola"};
var orig=foo;
sayHi= function(){orig.call(object1)};
sayHi(); <----- //Hi
sayHi.call(object2); <----- //Hi
Rule 4: The new key word
There are 4 things happen when the new key word put in front of a function call
1. A brand new object will be created
2. That object gets linked to different object <---- More clarifications later
3. That object gets bound as this key word
4. If that object return nothing, It will implicitly returns this .
Example :
var object1={
var name="Saif";
printName:function(){
console.log(name);
}
}
var object2= {name:"Khaled", printName:object1.printName};
var name="Belal";
var printMe=object1.printMe;
object1.printMe(); <---- Saif
object1.printMe(); <---- Khaled
printMe(); <---- Belal
No comments:
Post a Comment