30 Days Of JavaScript: Sets and Maps

_{Autore: Asabeneh Yetayeh
Gennaio, 2020}

<< Day 9 | Day 11>>

• Day 10
  • Set
    • Creare un set vuoto
    • Creare un set da un array
    • Aggiungere un elemento ad un set
    • Eliminare un elemento dal set
    • Verificare la presenza di un elemento nel set
    • Svuotare il set
    • Unione di set
    • Intersezione di set
    • Differenza tra set
  • Map
    • Creare un map vuoto
    • Creare un map da un array
    • Aggiungere valori ad un map
    • Ottenere un valore dal map
    • Controllare le key del map
  • Esercizi
    • Esercizi: Livello 1
    • Esercizi: Livello 2
    • Esercizi: Livello 3

Day 10

Set

L'insieme è una collezione di elementi. L'insieme può contenere solo elementi unici. Vediamo come creare un insieme nella sezione seguente.

Creare un set vuoto

const companies = new Set()
console.log(companies)

Set(0) {}

Creare un set da un array

const languages = [
  'English',
  'Finnish',
  'English',
  'French',
  'Spanish',
  'English',
  'French',
]

const setOfLanguages = new Set(languages)
console.log(setOfLanguages)

Set(4) {"English", "Finnish", "French", "Spanish"}

Set è un oggetto iterabile e possiamo iterare attraverso ogni elemento.

const languages = [
  'English',
  'Finnish',
  'English',
  'French',
  'Spanish',
  'English',
  'French',
]

const setOfLanguages = new Set(languages)

for (const language of setOfLanguages) {
  console.log(language)
}

  English
  Finnish
  French
  Spanish

Aggiungere un elemento ad un set

const companies = new Set() // creating an empty set
console.log(companies.size) // 0

companies.add('Google') // add element to the set
companies.add('Facebook')
companies.add('Amazon')
companies.add('Oracle')
companies.add('Microsoft')
console.log(companies.size) // 5 elements in the set
console.log(companies)

Set(5) {"Google", "Facebook", "Amazon", "Oracle", "Microsoft"}

Possiamo anche usare il ciclo per aggiungere elementi a un insieme.

const companies = ['Google', 'Facebook', 'Amazon', 'Oracle', 'Microsoft']
setOfCompanies = new Set()
for (const company of companies) {
  setOfCompanies.add(company)
}

Set(5) {"Google", "Facebook", "Amazon", "Oracle", "Microsoft"}

Eliminare un elemento dal set

Possiamo eliminare un elemento da un insieme utilizzando un metodo di cancellazione.

console.log(companies.delete('Google'))
console.log(companies.size) // 4 elements left in the set

Verificare la presenza di un elemento nel set

Il metodo has può aiutare a sapere se un certo elemento esiste in un insieme.

console.log(companies.has('Apple')) // false
console.log(companies.has('Facebook')) // true

Svuotare il set

Rimuove tutti gli elementi da un insieme.

companies.clear()
console.log(companies)

Set(0) {}

Vedere l'esempio seguente per imparare a usare set.

const languages = [
  'English',
  'Finnish',
  'English',
  'French',
  'Spanish',
  'English',
  'French',
]
const langSet = new Set(languages)
console.log(langSet) // Set(4) {"English", "Finnish", "French", "Spanish"}
console.log(langSet.size) // 4

const counts = []
const count = {}

for (const l of langSet) {
  const filteredLang = languages.filter((lng) => lng === l)
  console.log(filteredLang) // ["English", "English", "English"]
  counts.push({ lang: l, count: filteredLang.length })
}
console.log(counts)

[
  { lang: 'English', count: 3 },
  { lang: 'Finnish', count: 1 },
  { lang: 'French', count: 2 },
  { lang: 'Spanish', count: 1 },
]

Altri casi d'uso di set. Ad esempio, per contare gli elementi unici di un array.

const numbers = [5, 3, 2, 5, 5, 9, 4, 5]
const setOfNumbers = new Set(numbers)

console.log(setOfNumbers)

Set(5) {5, 3, 2, 9, 4}

Unione di set

Per trovare l'unione di due insiemi si può utilizzare l'operatore di divisione. Troviamo l'unione dell'insieme A e dell'insieme B (A U B)

let a = [1, 2, 3, 4, 5]
let b = [3, 4, 5, 6]
let c = [...a, ...b]

let A = new Set(a)
let B = new Set(b)
let C = new Set(c)

console.log(C)

Set(6) {1, 2, 3, 4, 5,6}

Intersezione di set

Per trovare l'intersezione di due insiemi si può utilizzare un filtro. Troviamo l'intersezione dell'insieme A e dell'insieme B (A ∩ B)

let a = [1, 2, 3, 4, 5]
let b = [3, 4, 5, 6]

let A = new Set(a)
let B = new Set(b)

let c = a.filter((num) => B.has(num))
let C = new Set(c)

console.log(C)

Set(3) {3, 4, 5}

Differenza tra set

Per trovare la differenza tra due insiemi si può utilizzare un filtro. Troviamo la differenza tra l'insieme A e l'insieme B (A B)

let a = [1, 2, 3, 4, 5]
let b = [3, 4, 5, 6]

let A = new Set(a)
let B = new Set(b)

let c = a.filter((num) => !B.has(num))
let C = new Set(c)

console.log(C)

Set(2) {1, 2}

Map

Creare un map vuoto

const map = new Map()
console.log(map)

Map(0) {}

Creare un map da un array

countries = [
  ['Finland', 'Helsinki'],
  ['Sweden', 'Stockholm'],
  ['Norway', 'Oslo'],
]
const map = new Map(countries)
console.log(map)
console.log(map.size)

Map(3) {"Finland" => "Helsinki", "Sweden" => "Stockholm", "Norway" => "Oslo"}
3

Aggiungere valori ad un map

const countriesMap = new Map()
console.log(countriesMap.size) // 0
countriesMap.set('Finland', 'Helsinki')
countriesMap.set('Sweden', 'Stockholm')
countriesMap.set('Norway', 'Oslo')
console.log(countriesMap)
console.log(countriesMap.size)

Map(3) {"Finland" => "Helsinki", "Sweden" => "Stockholm", "Norway" => "Oslo"}
3

Ottenere un valore dal map

console.log(countriesMap.get('Finland'))

Helsinki

Controllare le key del map

Controlla se una chiave esiste in una mappa usando il metodo has. Restituisce true o false.

console.log(countriesMap.has('Finland'))

true

Ottenere tutti i valori dalla mappa utilizzando il ciclo

for (const country of countriesMap) {
  console.log(country)
}

(2) ["Finland", "Helsinki"]
(2) ["Sweden", "Stockholm"]
(2) ["Norway", "Oslo"]

for (const [country, city] of countriesMap){
 console.log(country, city)
}

Finland Helsinki
Sweden Stockholm
Norway Oslo

🌕 Hai raggiunto un grande traguardo, sei inarrestabile. Continua così! Hai appena completato le sfide del 10° giorno e sei a 10 passi dalla tua strada verso la grandezza. Ora fai qualche esercizio per il cervello e per i muscoli.

Esercizi

Esercizi: Livello 1

const a = [4, 5, 8, 9]
const b = [3, 4, 5, 7]
const countries = ['Finland', 'Sweden', 'Norway']

1. creare un insieme vuoto
2. Creare un insieme contenente da 0 a 10 utilizzando il ciclo
3. Rimuovere un elemento da un insieme
4. Cancellare un insieme
5. Creare un insieme di 5 elementi stringa da un array
6. Creare una mappa di paesi e il numero di caratteri di un paese

Esercizi: Livello 2

1. Trovare un'unione b
2. Trovare un'intersezione b
3. Trovare a con b

Esercizi: Livello 3

1. Quante lingue sono presenti nel file oggetto Paesi.

2. *** Utilizzate i dati dei Paesi per trovare le 10 lingue più parlate:

   // Your output should look like this
   console.log(mostSpokenLanguages(countries, 10))
   [
     { English: 91 },
     { French: 45 },
     { Arabic: 25 },
     { Spanish: 24 },
     { Russian: 9 },
     { Portuguese: 9 },
     { Dutch: 8 },
     { German: 7 },
     { Chinese: 5 },
     { Swahili: 4 },
     { Serbian: 4 }
   ]

  // Your output should look like this
  console.log(mostSpokenLanguages(countries, 3))
  [
  {English:91},
  {French:45},
  {Arabic:25}
  ]

🎉 CONGRATULAZIONI ! 🎉

<< Day 9 | Day 11 >>