Loading
Current section: 1. Objects 7 exercises
solution

Property Access

Transcript

00:00 Let's go ahead and do this. We've got our, product, name, price, and in stock and category. And we want to log the product name. So we're gonna say console dot log product dot name. That dot is the accessor.

00:13 So product, if that If we think of product as being a basket, then the dot is how you reach into the basket and then the, the the string or or the those characters that come after the dot, that's a reference to what you grab when you pull it out of the basket. And so we're grabbing the name property and so this expression right here is just reaching in to grab the name property. And so what's going to be console logged is our typescript handbook, of course. And then we're going to log the, product price. Now this is using a special syntax called bracket notation and that is useful if you have a property that is not, or that has some sort of keyword in it like if we had if or I think this will probably work.

00:59 Yeah. Bad example. Bad example. What if we had two three four? That is not going to work because that's interpreted as a number.

01:08 So we can say two three three four and now we're able to access that property. So, we're gonna switch that back to price because we're not crazy people and we'll save price there. So that is bracket notation. You can even have spaces and things like that in property names if you use bracket notation. And we'll talk about how to create dynamic property names and and property names that aren't syntactically okay in a future step.

01:35 So stay tuned for that where this will become a lot more useful. You don't typically use this. Actually, what's more common is you'll say, property or price name and then price and then you'll do price name. There you go. And that actually is quite common.

01:52 Where you'll have a variable that's a reference to, the property that you wanna access and then you use bracket notation to access that, property. If you were to use a dot right here, then you'd be looking up the price name property, which Yeah. That's we don't have a price name property, so it's not gonna work. So the, bracket notation enables you to do that. So there you go.

02:14 Bracket notation. Woo. Okay. Now let's make a function called format product. We'll, take our, product.

02:23 And then this is actually how you type an object. Right here is just an inline. It looks kind of like an object. You have property names and their, types. So here we're using primitive types.

02:37 And then instead of commas, use semicolons in these types. We'll talk more about this in a a future workshop. And then you've got your price and number. So we're accepting kind of a a subset of the properties of a product here. All we care about are the name and the price.

02:53 And so that's why we have that typed as our p argument. Then we're gonna return a string which will be the combination of these two things. And again, I'm not a huge fan of, of specifying a return type if it can be inferred easily, which it can. So there we go. And now, let's uncomment this line, product.rating.

03:15 We're gonna get an error because rating does not exist on the type, object to name string, price number, in stock boolean, category string. So we did not put a rating in here. If we did, then we would not have that error. Great. So we'll comment that back out.

03:33 We'll comment format product and we'll export the things that we need to export. And here we are. We've got our, TypeScript handbook. We've got the 29, TypeScript handbook 29. All of that is working as we would expect, and we are now creating, objects and then accessing the properties of those objects.

03:53 Good job.