JAVASCRIPT OBJECTS

Balaji sankar
3 min readNov 4, 2020

What is an Object?

An object in JavaScript is a data type that is composed of a collection of keys and values, represented in value pairs. The name:value pairs can consist of properties that may contain any data type — including strings, numbers, and Booleans — as well as methods, which are functions contained within an object. The Key will always be a String.

In a nutshell, An object in javascript is an unordered collection of data.

Creating an Object

An object is a data type, just as a number or a string is also a data type. As a data type, an object can be contained in a variable. There are two ways to construct an object in JavaScript:

  • The object literal, which uses curly brackets: {}
  • The object constructor, which uses the new keyword

const superHero = {
name: ‘Barry Allen’,
super_hero_name: ‘Flash’,
power: ‘Super Speed’
}

In the above example superHero is an object in which name and super_hero_name and power are its keys and Barry Allen , Flash and Super speed are the values of those respective keys.

Each of these keys is referred to as properties of the object. An object in JavaScript may also have a function as a member, in which case it will be known as a method of that object

Properties and Methods

Objects can have properties and methods.

A property is the association between a name (key) and value within an object, and it can contain any datatype. A property generally refers to the characteristic of an object.

A method is a function that is the value of an object property, and therefore a task that an object can perform.

An easy way to remember the difference between object properties and methods is to think of a property as a noun, and a method as a verb.

Adding and Modifying Object Properties

In order to add a new property to an object, you would assign a new value to a property with the assignment operator (=).

// Add new age property to gimli
bike.color = 'red'; (or)bike["color"] = 'red';console.log(bike)
Output:
{
brand: "KTM",
model: "Duke",
cc: "250",
color: "red"
};The end result is that the color property gets set on the bike object. Whichever approach you use, you'll be just fine

Using the same method, an object’s property can be modified by assigning a new value to an existing property.
In order to remove a property from an object, you will utilize the delete keyword. delete is an operator that removes a property from an object.

//modify color property
bike.color= "black";// Remove color property from bike
delete bike.weapon;

Looping Through Object Properties

JavaScript has a built-in type of for loop that is specifically meant for iterating over the properties of an object. This is known as the for .. in loop.

We can use for .. in to traverse through all the properties of bike and print them to the console. Using bracket notation, we can retrieve the property value as a variable, in this case key.

// Iterate through properties of gimli
for (let key in bike) {
console.log(bike[key]);
}

Another useful enumeration method is the Object.key() method, which will return an array of the object’s keys.

// Initialize method on gimli object to return property keys
Object.keys(bike);Output:
["brand", "model", "cc"]

Objects are an extremely useful and versatile feature of the JavaScript programming language. They are some of the main building blocks of writing code in JavaScript, and are a practical way to organize related data and functionality.

--

--