Categorie
Javascript Programmazione

{JS} new Object

Nel precedente articolo dedicato all’oggetto Reflect abbiamo detto che molti dei metodi elencati sono similari ai metodi già presenti in Object; i quali, seppur similari, restituiscono valori differenti.
Cogliamo l’occasione per ricapitolare tutti i metodi di Object.

Object

In Javascript ogni oggetto è costruito sull’oggetto globale Object (Global Object), questo fa sì che tutti gli oggetti JavaScript abbiano alcuni metodi e proprietà comuni ed altre condivise ma accessibili solo dalla propria base Object.

Proprietà condivise con istanze

oggetto.costructorrestituisce in stringa il costruttore (es. “String”)
oggetto.prototypecon la proprietà “prototype” possiamo leggere, associare il prototipo di riferimento ed aggiungere proprietà agli stessi prototipi ed a tutte le sue istanze
Lettura prototipo
console.log(oggetto.prototype); 
Associazione prototipo
oggetto.prototype = Object.setPrototypeOf(oggetto, oggettoPrototipo);
Creazione nuove proprietà per il prototipo
oggetto.prototype.nuovaProprietà = "Lorem Ipsum";
oggetto.prototype.nuovoMetodo = function(){...};

Metodi condivisi con istanze

oggetto.toString()restituisce una versione in stringa dell’oggetto.
oggetto.valueOf()restituisce il corrispondente valore del tipo di dato primitivo associato all’oggetto

Metodi accessibili dalla base

⭐️ Object.create()metodo completo per la creazione di un oggetto; possiamo indicare prototipo, proprietà e descrittori data&accessor delle proprietàrestituisce un nuovo oggetto unificato
⭐️ Object.assign(oggetto, oggetto)copia tutte le 
proprie proprietà 
enumerabili da uno o più oggetti di origine a un 
oggetto di destinazione
restituisce un nuovo oggetto unificato
Object.defineProperties( oggetto, { ‘proprietaUno’: { data & accessor-descriptor }, ‘proprietaDue’: { data & accessor-descriptor} )definizione di proprietà multiple dello stesso oggetto include data&accessor descriptor restituisce l’oggetto passato alla funzione
⭐️ Object.defineProperty( oggetto, “proprietà”, { data-descriptor & accessor-descriptor } )definizione di una proprietà singola include data&accessor descriptorrestituisce l’oggetto passato alla funzione
Object.entries(oggetto)converte un oggetto in un array di coppia di valori [chiave,valore]array tipo [chiave, valore]
Object.fromEntries(oggetto)converte un array tipo [chiave, valore] o un oggetto Map in un oggetto sempliceun nuovo oggetto
⭐️ Object.freeze(oggetto)congela una oggetto e ne impedisce le modificherestituisce l’oggetto passato alla funzione
Object.isFrozen(oggetto)verifica se un oggetto è congelatoresituisce un valore booleano
⭐️ Object.preventExtensions()impedisce l’aggiunta di nuove proprietànulla
Object.isExtensible()verifica se all’oggetto è possible aggiungere proprietàresituisce un valore booleano
Object.getOwnPropertyDescriptor( oggetto, “proprietà” )restituisce una nuova istanza di un oggetto che contiene il riferimento ad una proprietà specifica permettendo di interrogarlo per conoscere i descriptor associati.un nuovo oggetto
Object.getOwnPropertyDescriptors(oggetto)restituisce una nuova istanza di un oggetto che contiene i riferimenti alle proprietà di un oggetto permettendo di interrogarle per conoscere i descriptor associati.un nuovo oggetto
Object.getOwnPropertyNames(oggetto)restituisce un array di stringhe di tutte i nomi delle proprietà di un oggetto array di stringhe
⭐️ Object.hasOwnProperty(oggetto, “proprietà”)Verifica se una proprietà è contenuto nell’oggettoresituisce un valore booleano
Object.hasOwn(oggetto, “proprietà”)come il precedente ma con alcune differenzeresituisce un valore booleano
Object.keys(oggetto)restituisce un array di stringhe contenente i nomi delle proprietàarray di stringhe
Object.values(oggetto)restituisce un array di stringhe contenente i valori delle proprietàarray di stringhe
⭐️ Object.setPrototypeOf(oggetto, prototipo)imposta il prototipo per un oggettol’oggetto passato alla funzione
⭐️ Object.getPrototypeOf(oggetto)restituisce il prototipo dell’oggettol’oggetto prototipo; se non presente null

Object.create() ⭐️

Con il metodo .create() dell’oggetto Object possiamo creare un oggetto indicando in un unica soluzione:

  • il prototipo di riferimento
  • le proprietà
  • i descrittori data e accessor delle proprietà
Prototipo di riferimento
Oggetto vuoto senza prototipo di riferimento
var articolo = Object.create(null);
Oggetto vuoto con prototipo di riferimento
var articolo = new Object.create(String.prototype);
Oggetto con prototipo di riferimento e proprietà
var marioRossi = Object.create(Persona.prototype, {
nome:{                                     
value: "Mario" },
cognome:{
value: "Rossi" }
});
I descrittori delle proprietà

Un descrittore, come il precedente visto “value”, è un oggetto che definisce caratteristiche e modalità di accesso alle proprietà di un oggetto.

Di descrittori di proprietà nè esistono due tipi:

Data descriptorspecifica una serie di caratteristiche per le proprietà di un oggetto
Accessor descriptordefinisce due modalità di accesso per i metodi di un oggetto
Data descriptor

Serie di caratteristiche per le proprietà di un oggetto

writableBooleano che indica se il valore della proprietà può essere modificato
configurableBooleano che indica se il tipo di descrittore può essere modificato e se la proprietà può essere rimossa
enumerableBooleano che indica se la proprietà è accessibile durante un ciclo sulle proprietà dell’oggetto
valueIndica il valore della proprietà
var marioRossi = Object.create(persona.prototype, {

nome: {
value        : "Mario",
writable     : false,
configurable : false },

cognome: {
value        : "Rossi",
writable     : false,
configurable : false },
  
indirizzo: {
value        : "",
writable     : true,
configurable : true }

});
Accessor descriptor

Definisce due modalità di accesso per i metodi di un oggetto

getcomportamento se si invocata un metodo di un oggetto senza passare valori (proprietà in lettura)
setcomportamento se si invocata un metodo di un oggetto con passaggio di valori (proprietà in scrittura)
var marioRossi = Object.create(Persona.prototype, {

nome: {
value        : "Mario",
writable     : false,
configurable : false },

saluta: {
get: function() {
     return "Ciao " + this.nome + "!" ; },
set: function(value) {
     return "Ciao " + this.nome +" da " + value +"!"; },
}                                                                          }
                                                                                       });

L’invocazione di del metodo “saluta()” dell’oggetto “marioRossi” mostrerà differenti risultati a seconda se invocato con o senza paramento.

marioRossi.saluta()
// Ciao Mario!
marioRossi.saluta("Giovanni");
// Ciao Mario da Giovanni!

Object.assign() ⭐️

Il metodo copia tutte le proprie proprietà enumerabili da uno o più oggetti di origine a un oggetto di destinazione

var oggetto = { a: 1, b: 2 };
var altroOggetto = { b: 4, c: 5 };

var nuovoOggetto = Object.assign(oggetto, altroOggetto);

// Risultato nuovoOggetto = {a: 1, b: 2, b: 4, c: 5}

Object.defineProperties()

Il metodo definisce proprietà multiple dello stesso oggetto includendo data&accessor descriptor.

var oggetto= {};
Object.defineProperties(oggetto, {
  'property1': {
    value: true,
    writable: true
  },
  'property2': {
    value: 'Hello',
    writable: false
  }

Object.defineProperty() ⭐️

Il metodo definisce una proprietà singola includendo data&accessor descriptor.

var oggetto = {};
Object.defineProperty(oggetto, 'nome', {
  value: "Mario",
  writable: false
});

Object.entries()

Il metodo restituisce un array di coppia di valori del tipo [chiave,valore]

var oggetto = {
nome: "Mario",
cognome: "Rossi",
email: "mario.rossi@gmail.com"
}

var arrayOggetto = Object.entries(oggetto);
//Risultato nome,Mario,cognome,Rossi,email,mario.rossi@gmail.com
Accedere alla proprietà tramite indici

Possiamo accedere alle proprietà estratte come se ci trovassimo di fronte ad un array bidimensionale

var arrayOggetto = [["nome","Mario"],["cognome","Rossi"],["email","mario.rossi@gmail.com"]];
document.write(arrayOggetto[0]);
//Risultato nome,Mario
document.write(arrayOggetto[0][1]);
//Risultato Mario
Effettuare un Ciclo for
var arrayOggetto = Object.entries(oggetto);
var chiave;
var valore;

for ([chiave, valore] of arrayOggetto) {
  document.write(chiave + ": " + valore + " ");
}
Convertire in oggetto Map
var arrayOggetto = Object.entries(oggetto);
var arrayOggettoMap = new Map(arrayOggetto);

//oppure
var arrayOggettoMap = new Map(Object.entries(oggetto));

Il costruttore new Map() accetta un iterabile di entries. Con Object.entries.

Object.fromEntries()

Il Object.fromEntries()metodo trasforma un elenco di coppie chiave-valore in un oggetto.

var arrayChiaveValore = [["valoreUno", 1],["valoreDue", 2]];
var oggettoMap = new Map([["valoreUno", 1],["valoreDue", 2]]);

// Conversione con Object.fromEntries()
var oggetto = Object.fromEntries(arrayChiaveValore);
var oggetto = Object.fromEntries(oggettoMap);

Object.freeze() ⭐️

Il Object.freeze()metodo blocca un oggetto. Un oggetto congelato non può più essere modificato; impedisce l’aggiunta di nuove proprietà, la rimozione delle proprietà esistenti, impedisce la modifica dell’enumerabilità, configurabilità o scrivibilità delle proprietà esistenti e impedisce la modifica dei valori delle proprietà esistenti.

var oggetto = {
  numero : 42
};

Object.freeze(oggetto );

//il valore della proprietà "numero" non sarà modificabile

Object.isFrozen()

Il metodo verifica se un oggetto è congelato; restiuisce un valore booleano.

var oggettoECongelato = Object.isForzen(oggetto);
// Risultato true

Object.preventExtensions() ⭐️

Il metodo impedisce di aggiungere nuove proprietà all’oggetto. A differenza di Object.freeze() non “blocca” tutto l’oggetto; le proprietà saranno quindi modificabili ma non sarà possibile aggiungerne delle nuove.

var oggettoDue = {
nome: "Luigi",
cognome: "Bianchi"
}

Object.preventExtensions(oggettoDue);
// All'oggettoDue non sarà possibile aggiungere altre proprietà

Object.isExtensible()

Il metodo verifica se all’oggetto è possibile aggiungere proprietà; restituisce un valore booleano.

var possibileAggiungereProprieta = Object.isExtensible(oggettoDue);
//Risultato false

Object.getOwnPropertyDescriptor()

Restituisce una nuova istanza di un oggetto che contiene il riferimento ad una proprietà specifica permettendo di interrogarlo per conoscere i descriptor associati.

Oggetto creato con Object.create()
var oggetto = new Object.create(Object.prototype, {
nome: {
value: "Mario",
writable: true,
configurable: true
});
var proprietaOggetto = Object.getOwnPropertyDescriptor(oggetto, "nome");

console.log(proprietaOggetto.value); // Risultato Mario
console.log(proprietaOggetto.writable); // Risultato true
console.log(proprietaOggetto.configurabile); // Risultato true

Object.getOwnPropertyDescriptors()

Se il metodo precedente consentiva di interrogare una proprietà specifica, il metodo Object.getOwnPropertyDescriptors() consente di interrogare tutte le proprietà nella stessa sessione.
Il funzionamento è del tutto similare utilizzeremo il precedente oggetto di esempio anche per questo medoto.

var tutteLeProprietaOggetto = Object.getOwnPropertyDescriptors(oggetto);

console.log(tutteLeProprietaOggetto.nome.value); 
// Risultato Mario
console.log(tutteLeProprietaOggetto.nome.writable); 
// Risultato true
console.log(tutteLeProprietaOggetto.nome.configurabile); 
// Risultato true
Note: nell'esempio precedente utilizziamo l'operatore membro indicando da prima il nome della proprietà ".nome" da interrogare e lo utilizziamo nuovamente ".value" per farci restituire il valore del descriptor.
Se avessimo avuto più proprietà nell'oggetto, ad esempio "cognome", avremmo scritto così:
tutteLeProprietaOggetto.cognome.value

Object.getOwnPropertyNames()

Object.getOwnPropertyNames()restituisce un array i cui elementi sono stringhe corrispondenti alle proprietà enumerabili e non enumerabili ad eccezione di quelle proprietà che utilizzano Symbol.

var persona = {
nome: "Mario",
cognome: "Rossi",
email: "mario.rossi@gmail.com
}
var nomiDiTutteLeProprieta = Object.gerOwnPropertyNames(persona);

// Risultato ["nome","cognome","email"]

Object.hasOwnProperty() ⭐️

Il metodo verifica se una proprietà è contenuta all’interno dell’oggetto indicato.

var marioRossi= {
nome: "Mario",
cognome: "Rossi",
email: "mario.rossi@gmail.com"
}

var verificaEsistenzaCognome = Object.hasOwnProperty(marioRossi, "cognome");

//Risultato true
Object.hasOwn()
Note: Object.hasOwn() è inteso come un sostituto per Object.hasOwnProperty().

l Object.hasOwn() metodo restituisce true se la proprietà specificata è una proprietà diretta dell’oggetto (anche se il valore della proprietà è nullundefined) non ricerca quindi le proprietà nei prototipi degli oggetti. Quest’ultimo non funziona per oggetti creati utilizzando Object.create(null) cosa che non fa il precedente metodo.

var verificaEsistenzaCognome = Object.hasOwn(marioRossi, "cognome");

//Risultato true

Object.keys()

Il metodo restituisce un array di stringhe contenente i nomi delle proprietà dell’oggetto indicato.

var arrayNomiProprieta = Object.keys(marioRossi);
//Risultato ["nome","cognome","email"]

Object.values()

Il metodo restituisce un array di stringhe contenente i valori delle proprietà dell’oggetto indicato.

var arrayValoriProprieta = Object.values(marioRossi);
//Risultato ["Mario","Rossi","mario.rossi@gmail.com"]

Object.setPrototypeOf() ⭐️

Il seguente metodo imposta il prototipo di un oggetto.
Con il primo argomento indichiamo l’oggetto a cui impostare il prototipo, mentre, con il secondo argomento indichiamo il prototipo-costruttore.

Creazione Classe costruttrice
class Persona{
constructor (nome,cognome,email){
this.nome = nome;
this.cognome = cognome;
this.email = email;
}}
Creazione oggetto e impostazione prototipo
var marioRossi = new Persona("Mario","Rossi","mario.rossi@gmail.com");
Object.setPrototypeOf(marioRossi, Persona);

Object.getPrototypeOf() ⭐️

Mentre con il prcedente metodo impostiamo il prototipo di un oggetto con Object.getPrototypeOf(), lo recuperiamo.

var prototipoDiMarioRossi = Object.getPrototypeOf(marioRossi);

document.write(prototipoDiMarioRossi);

Object.prototype

Come già visto all’inizio attraverso la proprietà “prototype” è possibile intervenire ed utilizzare metodi di “Object”, attraverso le istanze, sull’oggetto prototipo di un oggetto.

oggetto.prototype.constructorlegge e modifica il costruttore di un oggetto
oggetto.prototype.hasOwnProperty(proprietà)verifica se la proprietà appartiene al prototipo di un oggetto
oggetto.prototype.isPrototypeOf(altroOggetto)verifica se il prototipo di un oggetto e anche il prototipo di un’altro oggetto
oggetto.prototype.toString()restituisce una versione in stringa dell’oggetto prototipo dell’oggetto
oggetto.prototype.valueOf()restituisce il corrispondente valore del tipo di dato primitivo associato al prototipo dell’oggetto

Risorse sul web:
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/entries

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *