Object Properties

Properties are key:value Pairs

A JavaScript object is a collection of properties

Properties can be changed, added, and deleted.

Accessing JavaScript Properties

You can access object properties in these ways:

• Dot notation
• Bracket notation
• Expression

Examples

// objectName.property

let age = person.age;

Dot Notation

objectName.propertyName

Bracket Notation

objectName["propertyName"]

Note: In general, dot notation is preferred for readability and simplicity. Bracket notation is necessary in some cases: The property name is stored in a variable: person[myVariable] The property name is not a valid identifier: person["last-name"]

Bracket notation is useful when the property name is stored in a variable:

Example

let n1 = "firstName";

let n2 = "lastName";

let name = person[n1] + " " + person[n2];

Changing Properties

You can change the value of a property:

Example

person.age = 10;

Adding New Properties

You can add a new property by simply giving it a value:

Example

person.nationality = "English";

Deleting Properties

The delete keyword deletes a property from an object:

Examples

const person = {

  firstName: "John",

  lastName: "Doe",

  age: 50,

};

delete person.age;

Note: The delete keyword deletes both the value and the property. After deleting, the property is removed. Accessing it will return undefined.

Check if a Property Exists

Use the in operator to check if a property exists in an object:

Example

const person = {

  firstName: "John",

  lastName: "Doe"

};

let result = ("firstName" in person);

Nested Objects

Property values in an object can be other objects:

Example

myObj = {

  name:"John",
  age:30,

  myCars: {
    car1:"Ford",

  car2:"BMW",
    car3:"Fiat"

    }
}

You can access nested objects using the dot notation or the bracket notation:

Examples

myObj.myCars.car2;

Summary

• Object properties are key:value pairs
• Access properties with dot notation or bracket notation
• Add, change, and delete properties using assignment and delete
• Use the in operator to check if a property exists

Note: See Also: What are JavaScript Objects? What are Object Methods? What is this in Objects? How to Display JavaScript Objects What is an Object Constructor?

Note: Advanced Chapters: JavaScript Object Definitions JavaScript Object Advanced this JavaScript Object Iterations JavaScript Object Getters & Setters JavaScript Object Management JavaScript Object Protection JavaScript Object Prototypes JavaScript Object Reference