Premium Javascript Course

JavaScript Objects

Objects in JavaScript are collections of properties, with each property being a key-value pair. They allow you to store more complex data structures compared to arrays.

1. Creating an Object

You can create objects using object literals or the new Object() syntax.

Syntax (Object Literal):


let person = {
    name: "John",
    age: 30,
    city: "New York"
};
        

Syntax (Object Constructor):


let person = new Object();
person.name = "John";
person.age = 30;
person.city = "New York";
        

Both methods will create an object that contains properties: name, age, and city.

2. Accessing Object Properties

You can access object properties using dot notation or bracket notation.

Dot Notation:


let person = { name: "John", age: 30, city: "New York" };
console.log(person.name); // Output: John
        

Bracket Notation:


let person = { name: "John", age: 30, city: "New York" };
console.log(person["age"]); // Output: 30
        

Bracket notation is useful when the property name is dynamic or contains special characters.

3. Modifying Object Properties

To modify an object property, simply assign a new value to that property using dot notation or bracket notation.

Example:


let person = { name: "John", age: 30, city: "New York" };
person.age = 35; // Modify the age property
console.log(person.age); // Output: 35
        

4. Adding New Properties

You can also add new properties to an existing object.

Example:


let person = { name: "John", age: 30, city: "New York" };
person.country = "USA"; // Add a new property
console.log(person.country); // Output: USA
        

5. Deleting Object Properties

You can remove properties from an object using the delete operator.

Example:


let person = { name: "John", age: 30, city: "New York" };
delete person.city; // Delete the city property
console.log(person.city); // Output: undefined
        

6. Iterating Over Object Properties

To loop through all properties in an object, you can use the for...in loop.

Example:


let person = { name: "John", age: 30, city: "New York" };
for (let key in person) {
    console.log(key + ": " + person[key]);
}
// Output:
// name: John
// age: 30
// city: New York
        

7. Object Methods

Objects can also have methods, which are functions defined as properties within the object. These methods can be invoked like any other function.

Example:


let person = {
    name: "John",
    age: 30,
    city: "New York",
    greet: function() {
        return "Hello, " + this.name;
    }
};
console.log(person.greet()); // Output: Hello, John
        

8. The this Keyword

The this keyword refers to the current object when used inside a method. It allows you to refer to the properties of the object itself.

Example:


let person = {
    name: "John",
    age: 30,
    city: "New York",
    greet: function() {
        return "Hello, my name is " + this.name;
    }
};
console.log(person.greet()); // Output: Hello, my name is John
        

9. Nested Objects

Objects can also contain other objects as properties, allowing you to create complex data structures.

Example:


let person = {
    name: "John",
    age: 30,
    address: {
        street: "123 Main St",
        city: "New York",
        state: "NY"
    }
};
console.log(person.address.city); // Output: New York
        

10. Conclusion

JavaScript objects are fundamental for working with structured data. They allow you to store and manipulate related information in an organized way. Mastering object manipulation is essential for becoming proficient in JavaScript.