DEV Community

Cover image for Objects in javascript
Kamalesh AR
Kamalesh AR

Posted on

Objects in javascript

An object in JavaScript is a collection of key-value pairs. Each key-value pair is called as a property. A property can be a function, an array, an object itself or any primitive data type i.e. integer, string, etc. Functions in object are called as methods.

An object is a collection of key/value pairs or properties. When the value is a function, the property becomes a method. Typically, you use methods to describe the object’s behaviors.

Example:

const human = {
    firstName: "Virat",
    lastName: "Kohli",
    age: 30,
    fullName: function(){
        return this.firstName + " " + this.lastName     
    }
}
Enter fullscreen mode Exit fullscreen mode

Here firstName, lastName, and fullName are properties of the same object i.e. human. firstName is the key and Virat is the value of the property.

An object is a dynamic data structure that stores related data as key-value pairs, where each key uniquely identifies its value.

  • The values of properties can be primitives, objects, or functions (known as methods when defined inside an object).
  • Objects are mutable and dynamic properties can be added, modified, or deleted at any time.
  • Objects allow data grouping and encapsulation, making it easier to manage related information and behaviour together.

1. Creation Using Object Literal

The object literal syntax allows you to define and initialize an object with curly braces {}, setting properties as key-value pairs.

Exapmle:

let obj = {
    name: "Sourav",
    age: 23,
    job: "Developer"
};
console.log(obj);
Enter fullscreen mode Exit fullscreen mode

Output

{"name":"Sourav","age":23,"job":"Developer"}
Enter fullscreen mode Exit fullscreen mode

2. Creation Using new Object() Constructor

Example:

let obj = new Object();
obj.name= "Sourav",
obj.age= 23,
obj.job= "Developer"

console.log(obj);
Enter fullscreen mode Exit fullscreen mode

Output

{"name":"Sourav","age":23,"job":"Developer"}
Enter fullscreen mode Exit fullscreen mode

Accessing Object Properties

Dot Notation

let obj = { name: "Kamal", age: 22 };
console.log(obj.name);
Enter fullscreen mode Exit fullscreen mode

Bracket notation

let obj = { name: "Kamal", age: 22 };
console.log(obj["age"]);
Enter fullscreen mode Exit fullscreen mode

Adding Properties to an Object

let obj = { model: "Tesla" };
obj.color = "Red";

console.log(obj);
Enter fullscreen mode Exit fullscreen mode

Removing Properties from an Object

To delete a property from an object we can use the delete operator. You cannot delete properties that were inherited, nor can you delete properties with their attributes set to configurable.

"‘delete’ operator returns true if the delete was successful. It also return true if the property to delete was non-existent or the property could not be deleted."

let obj = { model: "Tesla", color: "Red" };
delete obj.color;

console.log(obj);
Enter fullscreen mode Exit fullscreen mode

Checking if a Property Exists

let obj = { model: "Tesla" };
console.log("color" in obj);
console.log(obj.hasOwnProperty("model"));
Enter fullscreen mode Exit fullscreen mode

Methods (Functions Inside Objects)

Objects don't only store data.

const car = {
  brand: "BMW",

  start() {
    console.log("Car Started");
  }
};
car.start();
Enter fullscreen mode Exit fullscreen mode

Output

Car Started
Enter fullscreen mode Exit fullscreen mode

Refernces:
https://medium.com/@happymishra66/objects-in-javascript-2980a15e9e71
https://www.geeksforgeeks.org/javascript/objects-in-javascript/

Top comments (0)