Esercizi sugli oggetti in JavaScript

Realizziamo alcuni esercizi sugli oggetti in JavaScript utilizzando gli oggetti letterali. L'utilizzo di questo metodo è il modo più semplice ed utilizzato per creare e manipolare oggetti in JavaScript.

In particolare in questa lezione studieremo come creare oggetti nidificati.

Esercizi con gli oggetti in JavaScript - esercizio 1

Progettare l'oggetto canzoni che contiene delle proprietà: canzone1, canzone2, ecc... Queste proprietà a sua volta sono degli oggetti che hanno altre proprietà: titolo, nomeCantante e anno. Inserire poi alcuni dati a piacere e visualizzarli. Dopo fare inserire all'utente delle nuove canzoni attraverso il prompt dei comandi. Visualizzare il nuovo oggetto così costruito.

Da zero ad eroe

Entra nel mondo della programmazione web: variabili, funzioni, array, DOM, eventi. Con esercizi pratici e progetti coinvolgenti.

8 ore di corso registrato
Più di 50 algoritmi risolti passo passo
Livello base — da zero ad eroe
100% online, fruibile quando vuoi

Come prima cosa memorizziamo in una variabile il riferimento all'oggetto canzoni. All'interno specifichiamo le due proprietà canzone1 e canzone 2 che a loro volta sono degli oggetti con il titolo, il nome del cantante e l'anno di produzione.

Dopo creiamo un'altra struttura analoga alla precedente, ma facciamo inserire i dati all'utente.

Infine utilizziamo object.assign per aggiungere questi dati all'oggetto creato in precedenza.

Ecco dunque il codice completo:

var canzoni = {
  canzone1 : {
    titolo: 'Stairway to Heaven',
    nomeCantante: 'Led Zeppelin',
    anno: '1971'
  },
  canzone2 : {
    titolo: 'Wish you were here',
    nomeCantante: 'Pink Floyd',
    anno: '1975'
  }
}
console.log(canzoni);

var canzoneAggiunta = {
  canzone3 : {
    titolo : prompt('Inserisci il titolo'),
    nomeCantante: prompt('Inserisci il titolo'),
    anno: prompt('Inserisci l\'anno'),
  }
}

Object.assign(canzoni,canzoneAggiunta);
console.log(canzoni);

Se invece volessimo stampare solo l'ultimo oggetto inserito, potrei scrivere:

console.log(canzoni.canzone3);

Esercizi con gli oggetti in JavaScript - esercizio 2

Progettare un oggetto rubrica che ha come proprietà gli utenti. Dopo, per ogni utente, specificare altre proprietà: utente, nome, cognome, telefono e indirizzo. Dove indirizzo è a sua volta un altro oggetto contenente altre proprietà.
Quindi popolare la rubrica con dei dati a piacere. Dopo eliminare un elemento e visualizzare nuovamente la rubrica così ottenuta.

Ecco dunque un altro esempio che utilizza gli oggetti nidificati in JavaScript.

var rubrica = {
  utente1: {
    nome: 'Coding',
    cognome: 'Creativo',
    telefono: '333',
    indirizzo: {
      via: 'delle rose',
      citta: 'Modica',
    }
  },
  utente2: {
    nome: 'Creativo',
    cognome: 'Coding',
    telefono: '124',
    indirizzo: {
      via: 'delle rose',
      citta: 'Modica',
    }
  }
}

console.log(rubrica);
delete rubrica.utente2;
console.log(rubrica);

In questa lezione abbiamo visto come utilizzare gli oggetti nidificati in JavaScript attraverso dei semplici esercizi dimostrativi. Nella prossima lezione studieremo gli array di oggetti.

Lezione precedente: class JavaScript

Lezione successiva: array di oggetti in JavaScript