JavaScript Objects

Introduction to JavaScript Objects

In JavaScript, objects are special variables that can hold a collection of data and more complex entities. Objects store data in the form of key:value pairs known as properties, and they can also include functions, referred to as methods.

Real-Life Analogy

Think of objects as a way to describe real-world entities, like a car, a person, or a house. For instance, consider a car object.

Car Object

Car Properties

• car.name = "Fiat"
• car.model = "500"
• car.weight = "850kg"
• car.color = "white"

Car Methods

• car.start()
• car.drive()
• car.brake()
• car.stop()

Though different cars share the same properties, the property values can vary. Similarly, while they have the same methods, the timing for executing these methods can differ.

Object Example

Here's a code snippet that assigns multiple values to a car object:

const car = {
  type: "Fiat",
  model: "500",
  color: "white"
};

• type, model, and color are properties
• "Fiat", "500", and "white" are property values

Defining Objects with Object Literals

An object literal is a simple and clear method to define a JavaScript object, using curly braces {} to encapsulate key:value pairs that describe the object's properties.

Creating a JavaScript Object

The easiest and most common way to create a JavaScript object is using an object literal. The examples below all define the same object:

• Objects can span multiple lines for clarity.
• You can start with an empty object and add properties later.
• It's recommended to use the const keyword when declaring objects.

Using the new Keyword

Using new Object() is unnecessary. Opt for object literals for better readability, simplicity, and performance.

Accessing Object Properties

Object properties can be accessed in two ways:

• Dot notation
• Bracket notation

JavaScript Object Methods

Objects can have methods, which are actions that can be performed on them. These methods are defined as functions stored as property values:

const person = {
  firstName: "John",
  lastName: "Doe",
  age: 50,
  fullName: function() {
    return this.firstName + " " + this.lastName;
  }
};

In methods, this refers to the object itself. In the example above, this refers to the person object.

In-Depth Learning

• Objects hold Properties and Methods.
• Properties are named Values stored as key:value pairs.
• Methods are Functions stored as key:function() pairs.

The Importance of Objects in JavaScript

Mastering objects is key to understanding JavaScript. Nearly everything in JavaScript is an object:

• Objects
• Maths
• Dates
• Arrays
• Maps
• Sets
• Regular Expressions
• Errors

All JavaScript values, except primitives, are objects.

JavaScript Primitives

A primitive data type can only hold a single value. JavaScript includes seven primitive types:

• string: "Hello"
• number: 3.14
• boolean: true
• bigint: 12345678901234
• null: null
• undefined: undefined
• symbol: Symbol()