Real Life Objects, Properties, and Methods

In real life, a car is an object.

A car has properties like weight and color, and methods like start and stop.

All cars have the same properties, but the property values differ from car to car.

All cars have the same methods, but the methods are performed at different times.


JavaScript Objects

JavaScript objects are containers for named values called properties.

Object Methods. Objects can also have methods.

Methods are actions that can be performed.

You have already learned that JavaScript variables are containers for data values.

This code assigns a simple value (Fiat) to a variable named car:

EXAMPLE ❯


Objects are variables too. But objects can contain many values.

This code assigns many values (Fiat, 500, white) to a variable named car:

EXAMPLE ❯


Object Definition

In JavaScript, an object is a standalone entity, with properties and type. Compare it with a cup, for example. A cup is an object, with properties. A cup has a color, a design, weight, a material it is made of, etc. The same way, JavaScript objects can have properties, which define their characteristics.

EXAMPLE ❯


Object Properties

The name:values pairs in JavaScript objects are called properties:

Property Property Value
firstName John
lastName Doe
age 50
eyeColor blue

Accessing Object Properties

You can access object properties in two ways:

objectName.propertyName OR objectName["propertyName"]

EXAMPLE ❯


EXAMPLE ❯


Object Methods

The Object class represents one of JavaScript's data types. It is used to store various keyed collections and more complex entities. Objects can be created using the Object() constructor or the object initializer / literal syntax.

Objects can also have methods.

Methods are actions that can be performed on objects.

Methods are stored in properties as function definitions.

Property Property Value
firstName John
lastName Doe
age 50
eyeColor blue
fullName function() {return this.firstName + " " + this.lastName;}

EXAMPLE ❯


The this Keyword

The JavaScript this keyword refers to the object it belongs to.

 

It has different values depending on where it is used:

 

In a method, this refers to the owner object.

 

Alone, this refers to the global object.

 

In a function, this refers to the global object.

 

In a function, in strict mode, this is undefined.

 

In an event, this refers to the element that received the event.

Methods like call(), and apply() can refer this to any object

EXAMPLE ❯


Accessing Object Methods

You access an object method with the following

syntax:

 objectName.methodName()

EXAMPLE ❯


Do Not Declare Strings, Numbers, and Booleans as Objects!

When a JavaScript variable is declared with the keyword "new", the variable is created as an object:

Avoid StringNumber, and Boolean objects. They complicate your code and slow down execution speed.

Example:

x = new String();        // Declares x as a String object
y = new Number();        // Declares y as a Number object
z = new Boolean();       // Declares z as a Boolean object