DEFINITION OF OBJECT

JS

In JavaScript, objects are important. If you understand objects, you understand JavaScript. In this language, almost “everything” is an object.

 

  • Booleans can be objects (if defined with the new keyword)
  • Numbers can be objects (if defined with the new keyword)
  • Strings can be objects (if defined with the new keyword)
  • Dates are always objects
  • Math is an object
  • Regular expressions are always objects
  • Arrays are always objects
  • Functions are always objects
  • Objects are always objects

All JavaScript values, except primitive values, are objects.

PRIMITIVE VALUES

A primitive value is a value that has no properties or methods. 3.14 is a primitive value. A primitive data type is a data that has a primitive value.

JavaScript defines 7 types of primitive data types:

  • string
  • number
  • boolean
  • null
  • undefined
  • symbol
  • bigint

Primitive values ​​are immutable (they are encoded and cannot be changed). If x = 3.14, you can change the value of x, but you can’t change the value of 3.14.

 

Primitive values

OBJECTS ARE VARIABLE

JavaScript variables can contain single values:

let person = “John Doe”;

Objects are variable. But objects can contain many values. Values are written as key-value pairs (key and value separated by colons).

let person = {firstName:“John”, lastName:“Doe”, age:50, eyeColor:“blue”};

A JavaScript object is a collection of values. It is common practice to declare objects with the const keyword.

const person = {firstName:“John”, lastName:“Doe”, age:50, eyeColor:“blue”};

PROPERTY OF OBJECTS

The names of the values (keys), in JavaScript objects, are called properties.

Property

METHODS OF OBJECTS

Methods are actions that can be performed on objects. Object properties can be both primitive values and other objects and functions. An object method is a property of the object containing a function definition such as fullName.

Methods

JavaScript objects are containers of value names, called properties and methods.

CREATION OF JAVASCRIPT OBJECTS

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

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

USE A LITERAL OBJECT

This is the simplest way to create a JavaScript object. Using a literal object, you define and create an object in a single statement. This object is a list of key: value pairs (such as age: 50) enclosed in braces {}.

The following example creates a new JavaScript object with four properties:

const person = {firstName:“John”, lastName:“Doe”, age:50, eyeColor:“blue”};

Spaces and line breaks are not important. An object definition can span multiple lines:

const person = {
  firstName“John”,
  lastName“Doe”,
  age50,
  eyeColor“blue”
};

or:

const person = {};
person.firstName “John”;
person.lastName “Doe”;
person.age 50;
person.eyeColor “blue”;

KEYWORD NEW

The following example creates a new JavaScript object using new Object (), then adds 4 properties:

const person = new Object();
person.firstName “John”;
person.lastName “Doe”;
person.age 50;
person.eyeColor “blue”;

The examples above do exactly the same. But you don’t need to use new Object (). For readability, simplicity, and speed of execution, use the object literal method.

JAVASCRIPT OBJECTS ARE MUTABLE

Objects are mutable: they are addressed by reference, not by value. If person is an object, the following statement will not create a copy of person:

const x = person;  // Will not create a copy of person.

Object x is not a copy of person. He is person. Both x and person are the same object. Any changes to x will also change person, because x and person are the same object.

const person = {
  firstName:“John”,
  lastName:“Doe”,
  age:50, eyeColor:“blue”
}

const x = person;
x.age 10;      // Will change both x.age and person.age

DEEPENING AI

In JavaScript, objects are one of the main and most powerful features of the language. An object in JavaScript is a structure for grouping and organizing related data and functionality. Objects are composed of key-value pairs (also called properties), where the keys are strings (or symbols) and the values can be of any type: numbers, strings, functions, other objects, etc.

1. Creating an object

There are several ways to create objects in JavaScript:

-Literal object: This is the simplest and most commonly used way to create an object.

let persona = {
    nome: “Mario“,
    cognome: “Rossi“,
    età: 30,
    saluta: function() {
         console.log(“Ciao, sono Mario!“);
    }
};

In this example, the person object has four properties: nome, cognome, età, and a saluta function.

-Object through the Object() constructor: You can create an object using the Object() constructor.

let auto = new Object();
auto.marca = “Fiat“;
auto.modello = “500“;
auto.anno = 2020;

2. Accessing and modifying properties

The properties of an object can be accessed and modified in two ways:

-Notation with dot:

console.log(persona.nome); // “Mario”
persona.età = 31;

-Parenthetical notation: This method is useful when the property name is dynamic or contains invalid characters for dot notation.

console.log(persona[“cognome”]); // “Rossi”
persona[“età”] = 32;

3. Methods of an object

A method is a function that is a property of an object. In the persona object above, saluta is a method.

persona.saluta(); // Output: “Ciao, sono Mario!”

4. Properties and special methods of objects

-this: Inside a method, this refers to the current object. This is useful when working with multiple properties inside a method.

let persona = {
     nome: “Mario“,
     saluta: function() {
console.log(“Ciao, sono ” + this.nome);
}
};
persona.saluta(); // “Ciao, sono Mario”

-Object.keys(): Returns an array containing all the keys (properties) of an object.

console.log(Object.keys(persona)); // [“nome”, “saluta”]

-Object.values(): Returns an array containing all property values of an object.

console.log(Object.values(persona)); // [“Mario”, function saluta() {…}]

-Object.assign(): This is a method used to copy the values of all properties of one or more source objects into a target object.

let target = {};
let source = { a: 1, b: 2 };
Object.assign(target, source);
console.log(target); // { a: 1, b: 2 }

5. Prototypes

In JavaScript, every object has a prototype object from which it inherits properties and methods. This inheritance mechanism is the basis of the concept of OOP (object-oriented programming) in JavaScript. The prototype object can be extended by adding methods or properties that will be shared among all objects that inherit it.

function Persona(nome, età) {
    this.nome = nome;
    this.età = età;
}

Persona.prototype.saluta = function() {
     console.log(“Ciao, sono ” + this.nome);
};

let persona1 = new Persona(“Luigi“, 25);
persona1.saluta(); // “Ciao, sono Luigi”

In this example, the saluta method is added to the prototype of the constructor function Persona, which means that all instances created via new Persona will inherit this method.

7. Objects as dynamic data containers

Objects in JavaScript can also be used as dynamic data containers, making it possible to add or remove properties at any time.

let libro = {};
libro.titolo = “Il Signore degli Anelli“;
libro.autore = “J.R.R. Tolkien“;
delete libro.autore;

In this example, we created the libro object, added properties and then removed a property with delete.

8. Objects and JSON

A widely used format for the representation and transmission of objects in JavaScript is JSON (JavaScript Object Notation). This format is particularly useful for exchanging data between server and client.

-Conversion from object to JSON:

let persona = {
nome: “Mario“,
età: 30
};
let json = JSON.stringify(persona);
console.log(json); // ‘{“nome”:”Mario”,”età”:30}’

-Conversion from JSON to object:

let json = ‘{“nome”:”Mario”,”età“:30}’;
let persona = JSON.parse(json);
console.log(persona.nome); // “Mario”

9. Basic concepts about objects.

-Enumerable properties: The properties of an object can be enumerated through for…in loops or methods such as Object.keys().

-Objects as references: In JavaScript, objects are passed by reference, not by value. Modifying a property of an object passed as an argument to a function will directly modify the original object.

let persona1 = { nome: “Mario” };
let persona2 = persona1;

persona2.nome = “Luigi“;
console.log(persona1.nome); // “Luigi”

Conclusion

Objects are a fundamental part of JavaScript and are extremely flexible and powerful. Understanding how to create, modify, and use them is essential to developing effective JavaScript applications.

LINKS TO PREVIOUS POST

THE JAVASCRIPT LANGUAGE

LINK TO THE CODE ON GITHUB

GITHUB