Press ESC to close

Oggetti e ciclo for in

0 1492

In questa lezione parleremo di oggetti e del ciclo for in in JavaScript, risolvendo alcuni semplici esercizi.

Esercizio su oggetti e ciclo for in

Progettare un array automobili che contiene alcuni oggetti e ogni oggetto contiene delle proprietà, ad esempio: marcamodello, alimentazione, tipo, colore, anno.
Inserire poi alcuni dati a piacere e visualizzare con un ciclo tutti i dati. Dopo visualizzare le caratteristiche solo delle auto a benzina. Poi visualizzare solo la marca ed il modello delle auto dell’anno 2014 o superiore. Infine visualizzare le auto che non sono di colore bianco.

Innanzitutto costruiamo il nostro array di oggetti in JavaScript, inserendo alcuni valori:

var auto = [
  {
    marca: 'Fiat',
    modello: '500',
    colore: 'bianco',
    alimentazione: 'benzina',
    anno: 2010
  },
  {
    marca: 'Fiat',
    modello: 'tipo',
    colore: 'grigio',
    alimentazione: 'diesel',
    anno: 2012
  },
  {
    marca: 'Porche',
    modello: 'Cayenne',
    colore: 'grigio',
    alimentazione: 'diesel',
    anno: 2019
  },
  {
    marca: 'Jeep',
    modello: 'Compass',
    colore: 'bianco',
    alimentazione: 'diesel',
    anno: 2016
  },
  {
    marca: 'Lancia',
    modello: 'Y',
    colore: 'verde',
    alimentazione: 'benzina',
    anno: 2014
  }
];

Adesso visualizziamo tutti i dati con un ciclo for che serve semplicemente a scorrere tutti gli elementi dell’array.

for (var i = 0; i < auto.length; i++){
  console.log(auto[i]);
}

Se vogliamo poi visualizzare singolarmente gli elementi di ciascun oggetto possiamo anche fare in questo modo:

for (var i = 0; i < auto.length; i++){
  console.log('oggetto ' + i);
  for (var k in auto[i]){
    console.log(auto[i][k]);
  }
}

Quindi per ciascun oggetto realizzo un ciclo for in che stampa tutte le proprietà.

Adesso dobbiamo visualizzare tutti i dati ma delle soli auto a benzina, dunque agiamo in questo modo:

for (var i = 0; i < auto.length; i++){
  if (auto[i].alimentazione == 'benzina'){
    for (var k in auto[i]){
      console.log(auto[i][k]);
    }
  }
}

Quindi controllo semplicemente che il valore dell’oggetto che ha la proprietà alimentazione contenga il valore benzina. Se è così allora stampo tutti gli elementi.

Per visualizzare solo la marca ed il modello delle auto dell’anno 2014 o superiore devo utilizzare un’altra istruzione condizionale.

In questo caso non mi serve il for in in quanto conosco già le proprietà che devo andare a stampare quindi posso scrivere semplicemente in questo modo.

for (var i = 0; i < auto.length; i++){
  if (auto[i].anno >= 2014){
      console.log(auto[i]['marca'] + ' ' + auto[i]['modello']);
  }
}

Ho dunque utilizzato soltanto il ciclo for.

Adesso dobbiamo visualizzare tutte le proprietà delle auto che hanno il colore diverso dal bianco. Dunque similmente a prima scrivo:

for (var i = 0; i < auto.length; i++){
  if (auto[i].colore != 'bianco'){
    for (var k in auto[i]){
      console.log(auto[i][k]);
    }
  }
}

In questa lezione abbiamo illustrato un semplice esempio di utilizzo degli oggetti e del ciclo for in, nelle prossime lezione proporrò altri esempi.

Alcuni link utili

Indice tutorial JavaScript

Le funzioni di callback

Esempi funzioni di callback

Come utilizzare le callback e setTimeout

Cifrario di Cesare online

Come realizzare un convertitore da decimale a binario, ottale ed esadecimale

Come creare PDF con JavaScript

PDF da un form con JavaScript

Proprietà di un PDF con JavaScript

Libreria jsPDF

Other stories

Esercizi sul ciclo for in JavaScript

Next Story

Esercizi for JavaScript

Previous Story