JavaScript Objects

In the previous article I presented the basics of what I learned about arrays in JavaScript and about the fact that arrays can also contain objects in their structure, that's why I want to present and write some basics about what I learned about objects in JavaScript!

JavaScript objects are part of the data types, that allows us to store a collection of related data and/or functionality. These usually consist of several variables and functions (which are called properties and methods when they are inside objects). Objects are variables too. But objects can contain many values.

In JavaScript, almost everything is an object. All primitive types except null and undefined are treated as objects. They can be assigned properties (assigned properties of some types are not persistent), and they have all characteristics of objects.

Syntax:

const objectName = {
   key1: value1,
   key2: value2
};        

Each member of an object is a key: value pair separated by commas and enclosed in curly braces {}. Examples:

// object creation
const person = { 
    name: 'John',
    age: 20
};
console.log(typeof person);   //output: object        

Or we can also define an object in a single line(object literal):

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

In the above example, name and age are keys, and John and 20 are values respectively. This two values are properties of an object. It is a common practice to declare objects with the const keyword.

Creating a JavaScript Object

With JavaScript, you can define and create your own objects. There are different ways to create new objects:

• Create a single object, using an object literal
• Create a single object, with the keyword new(new Object())
• Define an object constructor, and then create objects of the constructed type
• Create an object using Object.create()

Accessing Object Properties

We can access the value of a property by using its key.

• Using "dot" notation:

objectName.key        

Example:

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

// accessing property
console.log(person.name);   //output: John         

• Using bracket notation:

objectName["propertyName"]        

Example:

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

// accessing property
console.log(person["name"]);   //output: John        

JavaScript Nested Objects

An object can also contain another object. In this example, an object student contains an object value in the marks property:

// nested object
const student = { 
    name: 'John', 
    age: 20,
    marks: {
        science: 70,
        math: 75
    };
};

// accessing property of student object
console.log(student.marks);     //output: {science: 70, math: 75}

// accessing property of marks object
console.log(student.marks.science);    //output: 70        

JavaScript Object Methods

A method is a function stored as a property. Example:

const person = {
    name: 'Sam',
    age: 30,
    // using function as a value
    greet: function() { 
       console.log('hello'); 
    };
};

person.greet();    //output:  hello        

Here, a function is used as a value for the greet key. That's why we need to use person.greet() instead of person.greet to call the function inside the object.

Do not declare strings, numbers, and booleans as objects!

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