1 of 21

H - Programmazione Web con Javascript

ES05 - il tipo dato Oggetto

FB - 11.2024 - v1.1 (new)

“La teoria è quando si sa tutto e niente funziona. La pratica è quando tutto funziona e nessuno sa il perché. Noi abbiamo messo insieme la teoria e la pratica: non c'è niente che funzioni… e nessuno sa il perché!”

2 of 21

Le basi del linguaggio Javascript

Introduzione al linguaggio di programmazione JavaScript attraverso semplici esercizi

�

2

3 of 21

Indice

Obiettivi didattici
Introduzione teorica
Esercitazione
Valutazione

�

3

4 of 21

Obiettivi didattici

4

5 of 21

Obiettivi didattici

Il tipo dato Oggetto

5

6 of 21

Introduzione teorica

6

7 of 21

Oggetti

7

8 of 21

Oggetti

In JavaScript, gli oggetti sono una delle strutture dati fondamentali e sono ampiamente utilizzati per rappresentare e organizzare dati. Un oggetto JavaScript è una collezione di coppie chiave-valore, dove ogni chiave è una stringa (o un simbolo) e ogni valore può essere di qualsiasi tipo di dato, inclusi altri oggetti. Ecco come puoi definire e utilizzare gli oggetti in JavaScript:

// Creazione di un oggetto vuoto

let persona = {};

console.log(typeof persona); // -> object

// Creazione di un oggetto con proprietà

let studente = {

nome: "Mario",

cognome: "Rossi",

eta: 20,

isStudente: true,

corsi: ["Matematica", "Informatica"]

};

// Accesso alle proprietà utilizzando la notazione punto

console.log(studente.nome); // Output: Mario

console.log(studente.corsi[0]); // Output: Matematica

// Accesso alle proprietà utilizzando la notazione delle parentesi quadre

console.log(studente['cognome']); // Output: Rossi

8

9 of 21

Oggetti

// Modifica di una proprietà esistente

studente.età = 21;

// Aggiunta di una nuova proprietà

studente.indirizzo = "Via Roma, 123";

// Rimozione di una proprietà

delete studente.isStudente;

// Iterazione sulle chiavi dell'oggetto

for (let chiave in studente) {

console.log(chiave, studente[chiave]);

}

// Ottieni tutte le chiavi dell'oggetto come un array

let chiavi = Object.keys(studente);

console.log(chiavi);

// Funzione che accetta un oggetto come parametro

function stampaInfoPersona(persona) {

console.log(`${persona.nome} ${persona.cognome}, ${persona.età} anni`);

}

// Chiamata della funzione con un oggetto come argomento

stampaInfoPersona(studente);

Gli oggetti in JavaScript sono flessibili e possono essere utilizzati per rappresentare una vasta gamma di strutture dati. Possono essere annidati, ossia un oggetto può contenere un altro oggetto come valore di una delle sue proprietà. Questa flessibilità li rende molto potenti e versatili nella programmazione JavaScript.

9

10 of 21

Oggetti

In JavaScript, è possibile assegnare oggetti a variabili, array e proprietà in modo molto flessibile. Ecco alcuni esempi che mostrano come farlo:

// Creazione di un oggetto e lo assegniamo alle variabili persona1 e persona2

let persona1 = {nome: "Alice", età: 25, città: "Roma"};

let persona2 = {}; // Creazione di un oggetto vuoto

// Assegnazione dell'oggetto a una variabile

let utente = persona1;

/* In questo esempio, utente ora fa riferimento allo stesso oggetto a cui fa riferimento persona. Modificare utente o persona influenzerà lo stesso oggetto. */

// Creazione di oggetti

let oggetto1 = { id: 1, nome: "Oggetto 1" };

let oggetto2 = { id: 2, nome: "Oggetto 2" };

// Assegnazione degli oggetti a un array

let arrayDiOggetti = [oggetto1, oggetto2];

// Creazione di oggetti

let indirizzo = { via: "Via Roma", città: "Milano" };

// Oggetto che contiene un'altra proprietà oggetto

let persona = {nome: "Bob", residenza: indirizzo};

È importante notare che le assegnazioni di oggetti possono comportarsi in modo diverso rispetto a tipi primitivi come numeri o stringhe. Le assegnazioni di oggetti in JavaScript creano riferimenti, quindi quando si modifica l'oggetto attraverso una variabile, gli altri riferimenti a quell'oggetto vedranno le stesse modifiche.

10

11 of 21

Proprietà e metodi degli oggetti

Gli oggetti possono contenere dati sotto forma di proprietà e comportamenti sotto forma di metodi. I metodi degli oggetti sono semplicemente funzioni che sono associate a un oggetto. [link al codice]

let persona = {

cognome: "Rossi",

saluta: function() {

console.log("Ciao, oggi è una bella giornata!");

}

};

// Aggiunta proprietà

persona.name = "Mario";

// Aggiunta metodo

persona.greet = function() {console.log('hello');}

// Chiamata dei metodi

persona.saluta(); // Stampa: Ciao, oggi è una bella giornata!

persona.greet(); // Stampa: hello

11

12 of 21

Approfondimenti

12

13 of 21

Approfondimenti

13

14 of 21

Esercitazione

14

15 of 21

Esercizi a

15

16 of 21

Esercizio a

Creare uno script che interagisce con l'utente per ottenere il nome, il cognome e l'età e quindi creare un oggetto persona con queste informazioni, poi stampare su console l’oggetto e il suo contenuto.
Crea un oggetto che rappresenti un libro con le seguenti proprietà: Titolo, Autore, Anno di pubblicazione, Genere, Numero di pagine

Quindi, utilizza un ciclo for...in per stampare ogni proprietà dell'oggetto sulla console.

// Stampa le proprietà dell'oggetto sulla console

for (let key in book) {

console.log(`${key} -> ${book[key]}`);

}

16

17 of 21

Valutazione

17

18 of 21

Griglia di valutazione

Si ricorda l’importanza di svolgere e consegnare i progetti assegnati.

18

19 of 21

Grazie per l’attenzione

20 of 21

Link/Riferimenti

20

21 of 21

Revisioni

v1.0 02/01/24 - versione iniziale �v1.1 12/11/24 -

21