Welcome back.
Let's just start with syntax of object.
How can you create an object?
Now you see how beauty and object is.
So let's get started.
All right.
So, as usual, I have already created a folder called Objects.
Let me show you the name of my object as that grid as that.
And then inside, I have two files, my HTML and my JavaScript.
This folder is from an extension I installed as my life saver, so don't pay attention to that.
So if I open my.
H.M..
I have connected my JavaScript as that and next inside my JavaScript is empty canvas.
It's time to make our hands dirty.
All right, so how can we create objects?
We have two ways of creating objects.
But before we move on, the PDF guide about all the steps will be provided so you can download and make
reference to it.
For the meantime, follow me and then let's understand the concept.
Good.
So the first method is using the object constructor function.
Object constructor.
Function.
So let's see how to create.
So let's say that you want to create a person object.
So my keyword const and then my variable name core person and then equal to.
I'll break new and then object, uppercase object and then as a function.
So now I have created an empty object called person.
So if I check my console and I search for person, you see, I have it as carry places.
As you see here on the screen.
So this is my beautiful empty object.
So because there is no data inside, it's an empty object.
So how can we add properties to it?
So the first step of using this method is that, first of all, you create, let's say here create,
and then next step after creating, you add your properties to it.
Properties to it, and it's how we do it.
We take the person, the piece of dot, and here we see that we have built in methods on that, but
we can add our own properties and method to it.
So here I will say name.
Then I assign to, let's say John.
So if I check my console again and search for person and announce that I have a key value per property
name and then my value.
Perfect.
So I can go ahead and add more properties.
Let's say the person's age is equal to 30.
You get it.
Next is let's say person dot is.
He is married.
We see how how flexible this one is.
Let's say we see that I'm able to save all kind of data types in it.
Now I have a string number and a boolean.
I can also go ahead and also save what you call arrays of record.
So I can say person dot hobbies.
Then is equal to array.
See, then I said a person like sports.
After that.
The person like cooking?
Yes.
So now if I search for person, you see that I have this data.
If I open this, I have my key value.
Per h is a number.
Hobbies and array is married is true, and name is also a string that is flexibility.
How flexible an object is.
So the same way of creating we can create a.
So this method, like first of all, we create an empty object and then we add a property.
So the same process can be simplified.
So let me.
Comment this one out and then let me bring mine object here as that so I can do it on the fly.
OC then using dot notation to assign properties to my object.
So inside this I will bring in my curly braces.
And there you go.
So my key value pair.
Now I want name, which is John.
And then the age of the person, which is called 30.
You bring common separated pay.
Pay attention to that.
And let's say my hobbies, the normal hobby, the person hobby is semi-colon.
And then I read.
Yes I didn't mention that.
Bring semicolon and that.
So let's see.
Cooking.
Mm hmm.
Yes.
The last one is the person married, So let's say is.
Married to True.
And.
Come on.
Yeah, I think.
Yeah.
Okay, So if I save this one now, if I check for person objects, we see we have it as before.
So any of these methods are fine.
We can first initialize the empty object and add your properties, or you can do it on the fly.
This is what you call using the constructor function.
So method one.
What about method two?
So method two also use what is called the object literal syntax, which is called object literal syntax.
Let's see how it goes.
So let me create a same object by our naming.
Let me comment this one to avoid some.
Conflict of the variable name.
So the same thing const mind person and thing is you bring equal to and then you are carried racist
and that is it.
I'm done.
So if I check for person, if I check for person inside my console as person, remember before we have
the same curly braces.
That's how we can create this one.
So adding properties, we can do it in the same way as we did for this.
We have the the empty object that we added properties and we can also do it on the fly.
So let's see.
Let me see.
Add properties.
So first of all, person Dot's name.
Equal to John.
And then.
Oh, come on.
Not comma, sorry, semicolon like this one person does.
Age is equal to 30 person dot.
Dot is married is equal to true.
And then person does.
Hobbies.
Hobbies is equal to my empty array cooking.
And let's say sports.
Sports.
Yes.
So if I search for person.
Let's see.
I have it as before.
So it under the same process, we can add the properties on the fly.
So here, let me comment this one out.
This one out.
Let me copy this one and then as before.
Let's do it on the fly.
So space.
And here we can add the property names.
So first is the name of the person, not navigator, but the name of the person.
Is John.
And then.
Come on here.
Come on.
Pay attention to that.
An age is 30.
Come on and say it's married.
True.
Comma.
And then.
Hobbies.
Semi-colon.
Array of cooking.
And then.
Also.
Sports.
So now if I save it now, let's check it out.
Person.
We have the same process.
So now here is the question Which method should I use?
Well, I'm going to tell you from experience, looking at this one, this is a long way to go.
A person new object.
And then you come here, you add the properties or this one.
So I think it's a long, longer or a long way to go.
But this syntax is really precise.
This what you often see in documentation and project, because this is simple to use variable name,
object and your properties.
So this is a method that is mostly used and is what I like.
But in some use cases you may need to go by this idea.
Maybe after I finish to, I can come here and let's say I can add additional properties to it so I can
say that person does another property.
And.
And property.
Property?
Yeah.
So many say is equal to.
I don't know.
I do not know.
Yes.
Yeah.
So if I save this one, then I check for my person.
We see that I have additional property called.
I don't know.
So you see that How flexible it is.
So this is the syntax you are going to use often.