-
Notifications
You must be signed in to change notification settings - Fork 0
/
The "new" keyword
43 lines (32 loc) · 2.98 KB
/
The "new" keyword
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
The "new" keyword
function Person(name, age) {
this.name = name;
this.age = age;
}
var p = new Person("Adam", 21);
What does p.name output? You probably know the answer to this: "Adam".
What about p.age? 21
p is an object with two properties: name and age. name is equal to "Adam", and age is equal to 21.
But you probably don't know *how* this happens. In fact, you probably never even thought about it.
I hadn't until a developer explained it to me.
So, let's think about what happens in line 7. You declare a variable p, and assign it to the result of new Person("Adam", 21). Let me say that again(somewhat differently), the return value of new Person("Adam", 21) will be assigned to p.
But... what is the return value of new Person("Adam", 21)??? Your thought process may be something like this:
- "Well, I don't know what new does, but I know that Person("Adam", 21) is just calling the Person() function and passing in the parameters "Adam" and 21."
- "That's straightforward enough. So what happens when we call the Person function? Answer: lines 4 and 5 execute. Question: what happens when lines 4 and 5 execute?"
- "That's actually a tough question. Before even thinking about it, I see that it's not returning anything (there's no return keyword). I'm expecting it to return an object with the name and age properties set. But there's no return statement. Weird."
- "And I don't know what this will be. There isn't any object calling Person("Adam", 21"). Like if we ran x.Person("Adam", 21), this would be set to the x object. But there is no x object. Hmmmm. Oh, right - when there is no object calling a function, implicitly, the global object is making the call. So this will be equal to the global object. Let's just assume that it's window (in browsers, the global object is window)."
- "Ok... so calling Person("Adam", 21) is setting the name property of window to "Adam", and the age property of window to 21. That's like saying window.name = "Adam" and window.age = 21. Huh??? We're not supposed to be doing that. We're supposed to be *returning* an object with the name and age property set to these things. But we're not even returning anything. If we're not returning anything, than shouldn't p just be undefined? I think it should be, but clearly it's not. What's going on here???
Those are all the right questions, good thinking! Here is what happens:
function Person(name, age) {
this.name = name;
this.age = age;
}
is equal to
function Person(name, age) {
var o = new Object();
o.name = name;
o.age = age;
return o;
}
Under the hood, that's what's happening. That's how the this keyword is set. And that's how anything ends up being returned at all. Again, all you have to remember is that when a function is called with the new keyword in front of it, lines 27-30 are replaced with 34-39.
Note: this will happen even if the function isn't capitalized. Capitalization is just a convention to indicate a function that acts like a constructor. The code would execute the same way if it weren't capitalized.