DEV Community

Whoissosick
Whoissosick

Posted on

Object [JS]

const exampleObject = {
  propertyName: value;
}
Enter fullscreen mode Exit fullscreen mode

These pieces of information are called properties, and they consist of a name (or key) and a value.

There are two main ways to access object properties in JavaScript: dot notation and bracket notation.

console.log(person.name);  // Alice
console.log(person["name"]); // Alice
console.log(oddObject["1stProperty"]);  // Hello
Enter fullscreen mode Exit fullscreen mode

How Can You Remove Properties from an Object?

delete operator

const person = {
  name: "Alice",
  age: 30,
  job: "Engineer"
};

delete person.job;

console.log(person.job); // undefined
Enter fullscreen mode Exit fullscreen mode

Another way to remove properties is by using destructuring assignment with rest parameters. This approach doesn't actually delete the property, but it creates a new object without the specified properties:

const person = {
  name: "Bob",
  age: 25,
  job: "Designer",
  city: "New York"
};

const { job, city, ...remainingProperties } = person;

// { name: "Bob", age: 25 }
console.log(remainingProperties);
Enter fullscreen mode Exit fullscreen mode

In this example, we use destructuring to extract job and city from the person object, and collect the remaining properties into a new object called remainingProperties. This creates a new object without the job and city properties.

How to Check If an Object Has a Property?

hasOwnProperty() method

This method returns a boolean indicating whether the object has the specified property as its own property. Here's an example:

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

console.log(person.hasOwnProperty("name")); // true
console.log(person.hasOwnProperty("job")); // false
Enter fullscreen mode Exit fullscreen mode

Another way to check for the existence of a property in an object is to use the in operator. Like hasOwnProperty(), the in operator will return true if the property exists on the object. Here's how you can use it:

const person = {
  name: "Bob",
  age: 25
};
console.log("name" in person);  // true

const car = {
  brand: "Toyota",
  model: "Corolla",
  year: 2020
};

console.log(car.brand !== undefined); // true
console.log(car.color !== undefined); // false
Enter fullscreen mode Exit fullscreen mode

In this code, we check if car.brand and car.color are not undefined. This works because accessing a non-existent property on an object returns undefined. However, this method can give false negatives if a property explicitly has the value undefined.

How Do You Work with Accessing Properties from Nested Objects and Arrays in Objects?

const person = {
  name: "Alice",
  age: 30,
  contact: {
    email: "alice@example.com",
    phone: {
      home: "123-456-7890",
      work: "098-765-4321"
    }
  }
};

console.log(person.contact.phone.work); // "098-765-4321"
console.log(person['contact']['phone']['work']); // "098-765-4321"
Enter fullscreen mode Exit fullscreen mode

Now, let’s take a look at how we can access data where one of the object properties has the value of an array. Here is a modified person object that includes an array of addresses:

const person = {
  name: "Alice",
  age: 30,
  addresses: [
    { type: "home", street: "123 Main St", city: "Anytown" },
    { type: "work", street: "456 Market St", city: "Workville" }
  ]
};

console.log(person.addresses[1].city); // "Workville"
Enter fullscreen mode Exit fullscreen mode

Top comments (0)