Un semplice esempio può essere la realizzazione di uno script che permette di consultare un database. Un semplice elenco delle aziende più ricche di alcuni continenti, con il nome del CEO e il fatturato, può essere sufficiente.
const companies = [
{
name: "Shell",
CEO: "Ben Van Beurden",
revenue: 179.1,
continent: "Europa"
},
{
name: "BP",
CEO: "Bernard Looney",
revenue: 121.3,
continent: "Europa"
},
{
"name": "Berkshire Hathaway",
"CEO": "Warren Buffett",
"revenue": 584.6,
"continent": "Nord America"
},
{
"name": "Toyota",
"CEO": "Akio Toyoda",
"revenue": 223.5,
"continent": "Asia"
},
{
"name": "Samsung",
"CEO": "Kim Ki-nam",
"revenue": 221.2,
"continent": "Asia"
},
{
"name": "Sinopec",
"CEO": "Wang Yupu",
"revenue": 266.9,
"continent": "Cina"
},
{
"name": "CNPC",
"CEO": "Wang Yilin",
"revenue": 278.1,
"continent": "Cina"
},
{
"name": "MTN",
"CEO": "Ralph Mupita",
"revenue": 7.2,
"continent": "Africa"
},
{
"name": "Dangote",
"CEO": "Aliko Dangote",
"revenue": 4.3,
"continent": "Africa"
}
];
Il software accetta il nome di un’azienda e ha due possibilità, a seconda che il nome inserito sia o meno nel database. Se non c’è, risponde “L’azienda selezionata non è presente nella lista”, altrimenti restituisce il nome del CEO e se il fatturato dell’azienda (dati 2020) è maggiore di 100, anche quel dato.
const companyName = prompt("Quale azienda vuoi conoscere meglio?");
const selectedCompany = companies.find(company => company.name === companyName);
let output = "L'azienda selezionata non è presente nella lista";
if (selectedCompany) {
output = "CEO: " + selectedCompany.CEO;
if (selectedCompany.revenue > 100) {
output += "<br>Fatturato: " + selectedCompany.revenue;
}
}
document.body.innerHTML = output;
Tra i tag script bisognerà inserire prima il database, poi il codice.
Eseguendo il codice, il browser mostrerà le due diverse uscite.
Il box richiesta, attivato dalla funzione prompt, si presenterà in questo modo:
Selezionando un’azienda presente, se il fatturato è maggiore di 100 sceglierà due informazioni, CEO e fatturato, e le manderà sul browser attraverso innerHTML, analoga della console.log che abbiamo visto prima.
La pagina web mostrerà questi risultati:
Oppure solo il nome del CEO se il fatturato è minore di 100, come in quest’esempio per MTN:
Se, invece, il nome non è corretto o semplicemente non è nella lista, comparirà un messaggio standard:
