JavaScript Objects in Depth: A Comprehensive Guide for Beginners

A deep dive into the JavaScript core.

Photo by Mohammad Rahmani on unsplash

This is one of the core concepts in JavaScript that needs to be mastered.

What is Object in JavaScript?

An object in JavaScript is simply a map containing the key-value pairs. It is pretty much similar to:

1. struct in C
2. HashMap in java
3. unordered_map in c++
4. dictionary in python

So, if you’re coming from the above programming language, understanding JavaScript objects and constructors will be a piece of cake for you.

Note:- Sometimes Object is also referred to as “associative arrays” in other programming languages.

The value of a key can be a function, array, object, or any other primitive. If the value of a key is a primitive or any other object (PS: an array is also an object in JavaScript) then it's called properties but if it's a function then it's called method.

For example,

Person Object

In the above code, a person is an object which has keys sayHello and friends with value as function and arrays respectively.

Get Ajay Verma’s stories in your inbox

Join Medium for free to get updates from this writer.

You probably have heard that —

Almost everything is an object in JavaScript. So the question now arising is — what are the remaining ones that aren’t an object? Ans — Primitives

Primitive

A primitive (primitive value, primitive data type) is data that is not an object and doesn’t have any methods. There are 7 primitive data types — string, number, big int, boolean, undefined, symbol, and null.

All primitives are immutable i.e they can be replaced but can’t be altered. Let's understand this with an example:

Primitive — immutability example

How to Create an Object in JavaScript?

Creating an object at the beginning may seem odd but once you are used to it, you will love it.

The object syntax is wrapped by curly braces. And the key-value pair separated by a colon with a trailing comma is added inside the object.

var obj = { 
 name: ‘xyz’, 
 age: 26
}

we can also create an empty object and add properties as we go.

var obj = {}; // empty or blank object
obj.name = ‘xyz’;
obj.age = 26;

Both object declarations are the same.

In the next part, we will see the other ways to create an object in detail.

If you like my article, please follow me on Medium.

More content at PlainEnglish.io. Sign up for our free weekly newsletter. Follow us on Twitter and LinkedIn. Join our community Discord.