# An intro to objects

Confused about what an object is? 
Is there any similarity between a real-life object and the one in the programming world? 
No worries stick around, we will not only understand what it is but also learn how to create an object in JavaScript. 

So, let's begin.

Objects are similar to what life objects are. An example will help us understand better, say a car. It has a particular model, a color, a design, etc. which are its various properties. Likewise, objects in the programming world also have various properties associated with them.

![mustang.jpeg](https://cdn.hashnode.com/res/hashnode/image/upload/v1654592223859/OWYKte0tL.jpeg align="left")

There are a number of ways in which we can create an object, let's start with the simplest way i.e. `object literal`. So, we will try to syntactically represent the same example of the car mentioned above.

```
const car = {
model: "mustang gt",
color: "black",
};
``` 
Kaboom!! we have created an object with `model` and `color` properties. Here, inside the braces we have a **key** and **value** pair; `model`, `color` are **keys** whereas `mustang gt`, `black` are **values**. These values can be accessed and used further in the program. 

Now, let's try to create another object named `user` that contains a function. Yes, objects can have functions too.

```
const user = {
firstName: "Popat",
lastName: "Lal",
greet: function() {
     console.log('Welcome!');
   }
};
``` 
Thus, `user` object with properties `firstName`, `lastName`, and `greet` have been created. 

Now, suppose you need to display the full name of the user somewhere, how will you do it? Yes! by accessing the values of `firstName`, `lastName` and simply displaying them. You must be thinking how can one access them? No worries below are two ways, to explain the same.

Either, we can write `objectName.propertyName` or `objectName["propertyName"]` and to make it clear `propertyName` and **keys**  are the same.

```
user.firstName;
//or
user["firstName"];
```
We can access the function in a similar way in which we access other properties `user.greet` but here, we also need to add parenthesis at the end `()`.

```
user.greet(); // Welcome!
//or
user["greet"](); // Welcome!
```
If we forget to add the parenthesis `()`, then it would simply return the function definition.

Now, that we have got a basic understanding of objects, let us look into a little more advanced way of creating objects using the `constructor function`.

One thing to be noted, by convention the name of the constructor function always starts with caps.

```
function Person(name, age) {
  this.name = name;
  this.age = age;
  this.greet = function() {
      console.log(`Hi! ${this.name}`);
  }
}

const personOne = new Person('Jake', 25);

console.log(personOne);

personOne.greet(); // Hi! Jake
```
Here `this` refers to the object being created. If you want to know more about `this` keyword you can refer to this article [this keyword](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this).

Now, as shown above, to create an object from the `constructor function` we need to use the `new` keyword. And all the objects created from the `Person` function will have the `name`, `age`, and `greet` properties.

In, ES6 a new feature `class` was added for creating objects which is just a syntactic sugar over the `constructor function`. We are going to look into this in the upcoming blog.
 
That's it for now. 

I hope that you have got a basic understanding of objects and how to declare them in JavaScript. 

If you find this blog helpful do share it with your friends.


