JS Object Properties

Overview

Object properties in JavaScript allow you to associate values with keys within an object. Objects are fundamental data structures that represent a collection of related data and functionalities.


Creating Objects

Objects can be created using object literals or constructor functions.

1. Object Literal
Try yourself
        
            let person = {
    firstName: "John",
    lastName: "Doe",
    age: 30
};
        
    
2. Constructor Function
Try yourself
        
            function Person(firstName, lastName, age) {
    this.firstName = firstName;
    this.lastName = lastName;
    this.age = age;
}
var person = new Person("John", "Doe", 30);
        
    

Accessing Properties

Object properties can be accessed using dot notation or square bracket notation.

Try yourself
        
            let person = {
    firstName: "John",
    lastName: "Doe",
    age: 30
};

console.log(person.firstName);   // John
console.log(person["lastName"]); // Doe
        
    

Modifying Properties

Properties can be modified by assigning new values to them.

Try yourself
        
            let person = {
    firstName: "John",
    lastName: "Doe",
    age: 30
};

person.age = 31;
person["age"] = 31;

console.log(person.age);   // 31
console.log(person["age"]); // 31
        
    

Adding Properties

You can add new properties to an object by assigning a value to a new key.

Try yourself
        
            let person = {
    firstName: "John",
    lastName: "Doe",
    age: 30
};

person.city = "New York";
person["city"] = "New York";

console.log(person.city);   // New York
console.log(person["city"]); // New York
        
    

Deleting Properties

Properties can be deleted using the delete operator.

Try yourself
        
            let person = {
    firstName: "John",
    lastName: "Doe",
    age: 30
};

delete person.age;

console.log(person);   // firstName: "John", lastName: "Doe"
console.log(person.age);   // undefined
        
    

Looping through Properties

You can iterate through an object's properties using loops or the for...in loop.

Try yourself
        
            let person = {
    firstName: "John",
    lastName: "Doe",
    age: 30
};

for (var key in person) {
    console.log(key + ": " + person[key]);
}
        
    

Checking for Property Existence

You can check if an object has a specific property using the hasOwnProperty() method.

Try yourself
        
            let person = {
    firstName: "John",
    lastName: "Doe",
    age: 30
};

if (person.hasOwnProperty("age")) {
    console.log("Age property exists.");
}
        
    

Computed Property Names (ES6)

ES6 introduced computed property names, allowing dynamic property names during object creation.

Try yourself
        
            let propertyName = "color";
let car = {
    [propertyName]: "blue"
};
console.log(car.color);   // blue

        
    

Summary

Object properties are key-value pairs that enable you to store and access related data within objects. They are fundamental for creating complex data structures in JavaScript.