
Advanced JS Fundamentals to jQuery & Pure DOM Scripting Exercise 4: Implementing the ‘new’ Keyword
This course is out of date and does not reflect Frontend Masters current standards. We now recommend you take the JavaScript: The Hard Parts course.
Transcript from the "Exercise 4: Implementing the ‘new’ Keyword" Lesson
[00:00:00]
>> [MUSIC]
[00:00:03]
>> Alexis: The last part of this set of exercises. We're going to implement the new keyword as if it didn't exist. So we're gonna create var Person. This is our construct. We're going to give it a prototype. Method speak, it's just gonna say hello. Then we're gonna say var Person = new, and it's gonna have a signature of an object, and then an array of arguments.
[00:00:34]
>> Speaker 2: Signature function, it take function. You said object. Signature of the object.
>> Alexis: Signature of the function, I'm sorry. We want this signature, we want this implementation to do the same exact thing as you would say, var Person = new Person, with its arguments. And then at the end we should be able to say person.speak.
[00:01:01] Here's the hints that I just failed at verbalizing. Does that make sense? One other hint, you're not allowed to use the new keyword in the implementation of this function.
>> Speaker 2: [LAUGH]
>> Alexis: I see that a lot. Yes.
>> Speaker 2: Walking through the steps.
>> Alexis: Yes. So let's verbalize aloud, before we put this to code.
[00:01:32] Remember, verbalization is really, really important when you want to implement something. So what are the things that new does for us? I'll give you the first one if it's going to edge things along. Your hand came up.
>> Speaker 2: Creates a new instance of an object, for example.
>> Alexis: Creates a new object.
[00:01:50] That it was one of the things it does. It creates a new object. What else does it do?
>> Speaker 3: It sets the proto of the object to something.
>> Alexis: Yes, that's right. It sets the proto of the object to something. Does anyone know what it sets it to?
[00:02:07] That's exactly right. What does it set it to?
>> Speaker 4: To its default proto? If you don't know if you're attracted to anything else.
>> Alexis: It defaults. That answer is technically correct in a very abstract way.
>> Speaker 4: Function?
>> Alexis: Not to the function. You're getting close.
>> Speaker 4: Property?
>> [INAUDIBLE]
[00:02:38]
>> Alexis: Which function, like me ask that, which function do you think?
>> Speaker 5: I don't know I would call it the class, but.
>> Speaker 6: The prototype
>> Alexis: The prototype of what?
>> Speaker 7: Okay, the prototype.
>> Alexis: I feel like there should be a mind meld there. It's so close.
>> Speaker 6: [LAUGH]
[00:02:56]
>> Speaker 7: The prototype of a person or the prototype-
>> Alexis: Yes, yes. The prototype of the constructor function. [LAUGH] So if you're right, it was a function thing, it was a constructor and it is that prototype. So it's gonna set the proto of our new object to the prototype of our constructor.
[00:03:11] What else is it gonna do?
>> Alexis: I'll throw one of the easy ones. I wanted to get the new objects. It's going to call the function, right? It's gonna invoke our constructor.
>> Alexis: And what's the last thing it's gonna do? Or one of the other things it's gonna do.
[00:03:37] The last for this academic exercise, then I'll give you the technicality.
>> Alexis: What else is it gonna do?
>> Alexis: If you say var Person = new Person. We've deciphered it creates a new object, it sets the proto property to the prototype of person in our case. It invokes person, right?
[00:04:03] It calls it, and what else does it do?
>> Speaker 7: Returns it.
>> Alexis: Returns it, returns what?
>> Speaker 7: Returns person, lowercase person.
>> Alexis: But what is the lower case person?
>> Speaker 7: A new object.
>> Alexis: The new object, it returns the new object. These are the main things that the new keyword does for us.
[00:04:24]
>> Alexis: Make sense? So we're gonna write a function called NEW in all caps, that does those forming things for us. Cool?