JavaScript Objects

An object is a data structure that can hold multiple values, including other objects, functions, and primitive data types.

Objects can be created using object literals or using the Object() constructor.

Object Literals:

//creating an object using object literal notation
const person = {
  name: "John",
  age: 30,
  address: {
    street: "123 Main St",
    city: "New York",
    state: "NY",
    zip: "10001",
  },
  hobbies: ["reading", "painting", "swimming"],
  greet: function () {
    console.log(
      `Hello, my name is ${this.name} and I'm ${this.age} years old.`
    );
  },
};

//accessing object properties using dot notation
console.log(person.name); // "John"
console.log(person.address.city); // "New York"
console.log(person.hobbies[1]); // "painting"
person.greet(); // "Hello, my name is John and I'm 30 years old."

Using the Object() constructor:

//creating an object using the Object() constructor
const person = new Object();
person.name = "John";
person.age = 30;
person.address = {
  street: "123 Main St",
  city: "New York",
  state: "NY",
  zip: "10001",
};
person.hobbies = ["reading", "painting", "swimming"];
person.greet = function () {
  console.log(`Hello, my name is ${this.name} and I'm ${this.age} years old.`);
};

//accessing object properties using bracket notation
console.log(person["name"]); // "John"
console.log(person["address"]["city"]); // "New York"
console.log(person["hobbies"][1]); // "painting"
person.greet(); // "Hello, my name is John and I'm 30 years old."

Using the JavaScript Keyword new

The new keyword is used to create a new instance of an object from a constructor function.

As an example:

// Define a constructor function
function Person(name, age) {
  this.name = name;
  this.age = age;
}

// Create a new instance of Person using the `new` keyword
const john = new Person("John", 30);

// Access the properties of the new object
console.log(john.name); // Output: 'John'
console.log(john.age); // Output: 30

In the example:

• The Person function is used as a constructor to create a new object. The new keyword is used to create a new instance of the Person object, with the name 'John' and age 30.
• The john variable now refers to the new object that was created, which has the name and age properties that were defined in the Person constructor.

note

When a constructor function is used with the new keyword, the this keyword inside the function refers to the new instance of the object that is being created.

JavaScript Objects are Mutable

In JavaScript, objects are mutable, which means that their values can be changed after they are created.

As an example:

const person = {
  name: "John",
  age: 30,
};

// Changing the value of a property
person.name = "Jane";

// Adding a new property
person.address = "123 Main St";

console.log(person); // Output: { name: 'Jane', age: 30, address: '123 Main St' }

In the example

• We create an object called person with properties name and age.
• Then, we change the value of the name property to 'Jane' and add a new address property to the object.
• The person object is mutable, so we can change its values and add or remove properties as needed.