-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy paththis-intro.js
47 lines (30 loc) · 1.27 KB
/
this-intro.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
/*
While it may often seem that this is related to "object-oriented patterns," in JS this is a different mechanism.
If a function has a this reference inside it, that this reference usually points to an object. But which object it points to depends on how the function was
called.
It's important to realize that this does not refer to the function itself, as is the most common misconception.
*/
function foo() {
console.log( this.bar );
}
var bar = "global";
var obj1 = {
bar: "obj1",
foo: foo
};
var obj2 = {
bar: "obj2"
};
foo(); // "global"
obj1.foo(); // "obj1"
foo.call( obj2 ); // "obj2"
new foo(); // undefined
/*
There are four rules for how this gets set, and they're shown in those last four lines of that snippet.
foo() ends up setting this to the global object in non-strict mode -- in strict mode, this would be undefined and you'd get an error in accessing the bar
property -- so "global" is the value found for this.bar.
obj1.foo() sets this to the obj1 object.
foo.call(obj2) sets this to the obj2 object.
new foo() sets this to a brand new empty object.
Bottom line: to understand what this points to, you have to examine how the function in question was called. It will be one of those four ways just shown, and that will then answer what this is.
*/