Adding Methods

[00:00:00]
>> Now what we can do, is let's modify this slightly to have a couple methods. One is we're gonna pass state in and then we're gonna have a method called get state and select. And so what select is going to allow us to do is put in a property that we want, and then return that value.

[00:00:30]
So in JavaScript, when you want to select something off of an object and you don't know what that property is, it's going to change to be dynamic, then you can use what is called, basically this array notation. And so we're able to say, select the value of any of this dynamic property or this key that we send in, give me the value.

[00:00:55]
So I'm still gonna do client store. The difference is what have I described here, clients and current client well, I'm talking about state. So here, I'm gonna go clients date. There we go. And in the constructor we are going to go. So a constructor is a method that gets called anytime you construct a class.

[00:01:22]
So we're gonna go state, quiet state. And then within this we're just gonna go this.state equals state. And then from here we are going to have, was it get state. All this is going to do is return this.state. And then we have one more method which is going to be select, correct, which is going to take an ID, which will be a string.

[00:02:03]
And it's going to return this.state[ID]. Or I think I called this key. Let me just change this to be a little bit more semantically correct, all right? So now this is obviously breaking. Let me change this ever so slightly and instead of this let me go with initial client state and from here Let's do client, Client equals client store select, Current client.

[00:03:05]
We'll save this. And first let's just dump this out. There we go. All right, so now state that's clients. And current client. And then if we do current client, we'll save this, then that's the empty. But if I were to set this to anything else, so if I would've had that select method in there, then that would have worked.

[00:03:41]
So, before we go into the challenge, I just wanna open up the floor to any questions about what I've covered so far.
>> Will you repeat how the select with key works?
>> What we're doing here is array notation when you have an object. So in this case, an object that has more than one property.

[00:04:14]
So we have ID first name, last name company. And so just imagine any object that has a key and it has a value. Well, if you want to get a value off of an object based on the key, and so in other words, give me the first name, or give me the last name.

[00:04:33]
So that last name is essentially the key for the value. What you can do is instead of doing, let me do it this way. Well instead of essentially doing like this.peter.firstname or this.peter.lastname. I don't really need this because it's not inside of a class. And I wanna say give me the first name or the last name, what I can do is, I can go Peter and then in essentially close.

[00:05:13]
I can send in a strain that represents the key, I could say first name. So what I can do here is just say key equals first name. And so this is a way for me to dynamically traverse this object and make that key dynamic. Or what I could do is instead I can just pass this in if I want the first name.

[00:05:37]
But if I want it to be last name, I just do it here and then returns the last name. And so this is a way to access really dynamically access a value on an object using array notation here. That makes sense.
>> Yeah, so in this case you're passing the entire object as a key.

[00:05:59]
So it was just a string. So keys are strings, because properties are strings. So an object is just a key value pair. So, first name and last name. These are just represented as strings. And so I'm saying give me The value that's stored of this property so in this case is gonna be porker.

[00:06:24]
If I did first name, it's gonna be Peter. And so what it's doing is it's looking up essentially the property or the key on that which is a string and then returning that value. Does that make sense?
>> Yeah, it makes sense. I was confused because I felt that in the store, you were passing the entire object.

[00:06:50]
>> So in the store, I'm passing in, the state object in the constructor. But then I'm saying I want to be able to select slices off of that. And so for here, we're passing in the entire state object, and then I'm able to select a slice of that state off and then return it.

[00:07:18]
So what I could do here, I could go current clients and I just need that slice off of the state, sorry, no clients store, select client. Now if I go here and I dump this out, what it's gonna return is that whatever value is it that key.
>> Okay so you were selecting the slice, okay.

[00:07:55]
When you are dealing with etc. When you have a selector guess what, this is pretty much all that's happening under the hood. Your state is a single state object and you are going through and you are saying give me a piece of this. And then you might even have that actually to be a function to take the state and then do some manipulation and then send it back.

[00:08:17]
Should I put my base models and my domain models together? Typically, I will put all of my models because that represents the entire application in a single place. So this is a little bit angular mono repo specific. Well, if you're in a mono repo, you can really do a lot of different things.

[00:08:40]
But I will typically put all of my interfaces in a single interface file that lives in a library that I can share with my angular apps, my react apps and my node apps. And so this is what this would look like in a real project is that I would go and I would build out projects interfaces and everything.

[00:09:07]
So I have a single file. That's the finding my domain model. And then from there I can share that and communicate that to the rest of the application. So that's a very good question. I tend to try to put all of my interfaces in a single place so that every other project application library can benefit from that.

[00:09:31]
All right, so another question is let's say we have an interface describing a form. How does it help when a user is interacting with it at runtime? So, when you think about a form, I would actually not have an interface that defines a form. I wouldn't have an interface that defines the data structure and then the form is merely a representation of that interface.

[00:09:58]
And so I would never define an interface for a form. I would just define my interfaces and then the forms would essentially conform to that. And so that's where you start at the very base is your domain models. Everything else is a representation of that.