JavaScript JS Tutorial JS Objects JS Functions JS Classes JS Async JS HTML DOM JS Browser BOM JS Web APIs JS AJAX JS JSON JS vs jQuery JS Graphics



Object Properties

JavaScript is an object-oriented programming language that allows developers to create and manipulate objects. Objects are a collection of properties that describe the characteristics of an entity. Properties are the key-value pairs that define the attributes of an object. In this article, we will discuss object properties in JavaScript.

What are Object Properties?

Object properties are the attributes that define an object. They are the key-value pairs that describe the characteristics of an entity. Properties can be added, modified, or deleted from an object at any time during the execution of a program. In JavaScript, objects are dynamic, which means that they can be changed on the fly.

Object properties can be of any data type, including strings, numbers, booleans, arrays, and even other objects. Properties can also be functions, which are known as methods. Methods are used to perform actions on an object or to return a value based on the object's properties.

Accessing Object Properties

Object properties can be accessed using dot notation or bracket notation. Dot notation is used to access properties that have a valid identifier name. Bracket notation is used to access properties that have a name that is not a valid identifier or that contains spaces or special characters.

Here is an example of accessing object properties using dot notation:


const person = {
  name: 'John',
  age: 30,
  address: {
    street: '123 Main St',
    city: 'Anytown',
    state: 'CA'
  }
};

console.log(person.name); // Output: John
console.log(person.age); // Output: 30
console.log(person.address.street); // Output: 123 Main St

Here is an example of accessing object properties using bracket notation:


const person = {
  name: 'John',
  age: 30,
  address: {
    street: '123 Main St',
    city: 'Anytown',
    state: 'CA'
  }
};

console.log(person['name']); // Output: John
console.log(person['age']); // Output: 30
console.log(person['address']['street']); // Output: 123 Main St

Adding Object Properties

Object properties can be added to an object using dot notation or bracket notation. Here is an example of adding a property to an object using dot notation:


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

person.address = {
  street: '123 Main St',
  city: 'Anytown',
  state: 'CA'
};

console.log(person.address.street); // Output: 123 Main St

Here is an example of adding a property to an object using bracket notation:


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

person['address'] = {
  street: '123 Main St',
  city: 'Anytown',
  state: 'CA'
};

console.log(person['address']['street']); // Output: 123 Main St

Modifying Object Properties

Object properties can be modified using dot notation or bracket notation. Here is an example of modifying a property using dot notation:


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

person.age = 40;

console.log(person.age); // Output: 40

Here is an example of modifying a property using bracket notation:


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

person['age'] = 40;

console.log(person['age']); // Output: 40

Deleting Object Properties

Object properties can be deleted using the delete operator. Here is an example of deleting a property:


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

delete person.age;

console.log(person.age); // Output: undefined

Note that deleting a property does not affect the object's prototype chain.

Conclusion

Object properties are the attributes that define an object. They are the key-value pairs that describe the characteristics of an entity. Properties can be added, modified, or deleted from an object at any time during the execution of a program. In JavaScript, objects are dynamic, which means that they can be changed on the fly.

References

Activity