Enhanced Object Literals

[00:00:00]
>> Maximiliano Firtman: Object literals that sometimes we say JSON, okay? But actually, JSON isn't a spec, it's hardly defined, and actually, these changes are not part of the JSON spec. So that's why it's object literals that at one point, and JavaScript object literal was the same as JSON, but now we are making a difference.

[00:00:24]
So for example, I have two variables, two immutable variables or two constants, name and age, and then a function, greet. And then I'm greeting a person, and this is an object literal. So now we have a shorthand property, so instead of saying name, name, age, it's equals to age, and greet is equals to greet, that is the normal.

[00:00:50]
Because I have the key, this is key: value, JSON is key: value, a key, colon, value. When the key and the value are just the same, the same name and age, we have a shorthand now, and we can just say name, age, okay? Again, if you do that, you're getting out of the JSON syntax, that's not JSON-compatible, okay?

[00:01:16]
It's an object literal. So that's the shorthand, okay, both for properties and methods, that actually, method is just a property of type function. And another new thing that we have is a way to define the property name as a compute variable. What is this? For example, I can create a constant here.

[00:01:41]
The name of the property is in a variable. So I will say the property, the newProp is gonna be the email. So then, if I wanna say the name of the person, the age, the email, instead of saying emails, email: to wherever.
>> Maximiliano Firtman: I will say instead of email, I wanna take the value of the newProp variable, okay?

[00:02:11]
So if I say newProp here, it's not gonna work because it will be person.newProp. Make sense? So if I want actually to take the value of the newProp, I need to use brackets, square brackets. In this case, I'm saying the email, so the person will have an email now.

[00:02:32]
So if I do console.log(person.email), I have a greet, what is greet? I don't know, remove that. I have a greet, remove the greet, I don't need the greet now, when I see the email. Let's see, I have an error because I don't have a comma. Remember that the literal needs a comma, okay?

[00:02:55]
So there we are. So now I'm getting the email, okay? So again, person.email, you don't see the email. When you see the object declaration, you don't see the email. The email and the name of the property was defined in brackets. So you can kind of dynamically create an object literal based on this.

[00:03:17]
>> Audience: Super in the weeds, but so it's like maps. You can have the key be an object, right? Does that function similarly with dynamically computed property names or strings only?
>> Maximiliano Firtman: No, in a JavaScript object, the key is always a string, it must be a string. So that key must be a string.

[00:03:37]
If not, it's not gonna work. If you want something different as a key, you need a map. We'll get into a map in a couple of minutes when we get into collections, okay? But it's always, in a JavaScript object literal, the key is always a string. But it can be a string with weird characters, okay?

[00:04:01]
It can be a string. Also, you can use this syntax, okay, that the new syntax that we have. I'm not saying you wanna do this, okay? But I can open here and say postal address, with spaces.
>> Maximiliano Firtman: Can I do that? Yes, with this new syntax, and then I pass a string.

[00:04:27]
The key is a string, but using spaces that, of course, then you cannot use the .syntax to access that property. Make sense? And you can also even use something like this.
>> Maximiliano Firtman: You can have a little cow as the name of a property in an object literal. Any Unicode character will work, any emoji will work.

[00:04:55]
Again, I'm not saying you are going to use that, but you can. But for that, you need to use this special syntax, this new syntax available in ESX.