I was working through the beginner JS stuff a little bit ago and got about idk 7 or 8 challenges in and realized I had no clue about what I was doing. I have no idea what an object is or really what it does. Is it like a container or what? Why do I need 10093849280 different ways to access what’s inside of it? When will I ever need this?
Yes, it’s a container for grouping related information.
Let’s imagine you need to keep track of information about a person. You can do this, and it’s certainly valid JS code.
person1Name = ‘John Doe’;
person1Age = 45;
person1Occupation = ‘Duck Trainer’
So all looks fine and dandy… if you want to access this person’s info, you just need to refer to the different variables.
Ok… now let’s say you need to keep track about another person… what are you going to do? Do you do this?
person2Name = ‘Jane Austen’;
person2Age = 37;
person2Occupation = ‘Author’
If you keep on doing this, what are you going to do if you need to keep track of 100 people? You’ll have to create 300 individual variables! What if you also need to keep track of this person’s address, city, state, country, etc… that’s going to be a lot of variables!
And how are you going to work on these variables? Let’s say, list all people whose age is 18 and above?
Are you going to do this?
if (person1Age > 18){
do something
}
if (person2Age > 18){
do same thing
}
etc.....
These 3 pieces of variables for each person, for all intent and purposes seem unrelated.
In the real world, we look at things around us as objects.
So wouldn’t it be better if we group these different pieces of information and assign it to the same piece of object? – just like in the real world?
In code, it will be like so:
person = {name:'John Doe', age:45, occupation:'Duck Trainer'}
Isn’t this more clearer in it’s intent and organization?
Then if you need to access this person’s information, you just do a
person.name // answer: 'John Doe'
person.age // answer: 45
person.occupation // 'Duck Trainer
And what if there are several persons we need to keep track of?
Wouldn’t this be better? Than using 6 individual variables ?
person = [
{name:'John Doe', age:45, occupation:'Duck Trainer'},
{name:'Jane Austen', age:37, occupation:'Author'}
]
and to access the information, we can do
person[0].name // John Doe
person[1].name // Jane Austen
Notice, only the numbers 0…1…2…etc in the index will be changing, instead of the whole variable name.
And if we want to refer collectively to the whole group of “persons”, we can easily do so by referring to the ‘person’ object.
Anyways, that’s a quick and simple answer to why objects are useful.
In usage, objects are even more powerful and flexible. Because you can have functions as part/members of your object.
person = {name: 'John Doe', sayHello: function() {
console.log("hello, I'm " + this.name);
}
}
Here, we have an object with a name property, but also a “sayHello” function as part of it’s definition.
As before, if you do a:
person.name // you get 'John Doe'
but now you can also do
person.sayHello() // hello, I'm John Doe
So yes, an object is a container… not only for bits and pieces of information, but it can also contain other objects, or even working functions.
I hope this helped a bit…
UPDATE: fixed speeling mistakes
5 Likes
That helped a lot, this has been one of my first code-based roadblocks that I have faced thus far, thank you for the help!
Except “person” in that example is no longer an object, it’s an array of objects. It’d also be a bit more idiomatic to name the variable “people”.
Yes, it’s an array of objects.
Maybe, but then it becomes…
people[0].name // John
people[1].name // Jane
which is now idiomatically wrong.
Like do you say in english “What’s the people’s name?”
I mean idiomatic as in how people usually write JavaScript, not how people usually write English. Though on second Googles it seems like there’s less consensus on that than I thought.