In questo secondo articolo della guida inizieremo a scoprire qualcosa riguardo al JavaScript. Partiremo dalle basi, iniziando con una lista delle parole chiave e degli operatori del JavaScript.
Gli operatori sono simboli o parole che creano una relazione tra più elementi, come un\’operazione aritmetica o l\’assegnazione di una variabile.
Le parole chiave (o riservate), del JavaScript sono delle parole che indicano alcune specifiche azioni e non possono essere utilizzate come nomi per variabili, etc…

---

Sommario

• Introduzione
• Lista degli operatori
• Lista delle parole chiave
• Conclusione

---

Lista degli operatori

Partiamo vedendo quali sono gli operatori, suddivisi in categorie, e quali sono le loro funzioni.

Operatori di comparazione

Questi operatori ci permettono di comparare più elementi. Tutti restituiscono un boolean.

Uguaglianza: ‌ ‌==

Con questo simbolo possiamo controllare se due elementi sono uguali.
Nel caso i due elementi siano di tipo diverso (ad esempio una stringa e un numero), verranno convertiti allo stesso tipo.

Sintassi:

a == b;

Esempi:

10 == 10; // true
new String() == new String(); // false - 2 object (che non fanno riferimento alla stessa variabile) sono sempre diversi
\"15\" == 15; // true - La stringa viene convertita in numero e 15 viene rilevato
\"0\" == undefined; // false

Disuguaglianza: ‌ ‌!=

Con questo simbolo possiamo controllare se due elementi sono diversi.
Nel caso i due elementi siano di tipo diverso, verranno convertiti allo stesso tipo.

Sintassi:

a != b;

Esempi:

10 != 10; // false
null != undefined; // false
new String() != new String(); // true
\"15\" != 15; // false
\"0\" != undefined; // true

Uguaglianza stretta: ‌ ‌===

Con questo simbolo possiamo controllare se due elementi sono identici.
Nel caso i due elementi siano di tipo diverso, non verranno convertiti allo stesso tipo e l\’uguaglianza sarà falsa.

Sintassi:

a === b;

Esempi:

10 === 10; // true
\"15\" === 15; // false - Una stringa non sarà mai uguale ad un numero con l\'uguaglianza stretta
null === undefined; // false - Sono di due tipi diversi perciò non possono essere uguali
\"sus\" === \"Sus\"; // false - la prima lettera della stringa a sinistra è minuscola, mentre nella seconda stringa è maiuscola

Disuguaglianza stretta: ‌ ‌!==

Con questo simbolo possiamo controllare se due elementi non sono identici.
Nel caso i due elementi siano di tipo diverso, non verranno convertiti allo stesso tipo e la disuguaglianza sarà vera.

Sintassi:

a !== b;

Esempi:

10 !== 10; // false
\"15\" !== 15; // true
null !== undefined; // true
\"sus\" !== \"Sus\"; // true

Maggiore: ‌ ‌>

Con questo simbolo possiamo controllare se un numero è maggiore di un altro.
Nel caso i due elementi siano di tipo diverso, verranno convertiti allo stesso tipo.

Sintassi:

a > b;

Esempi:

// Evita di usare delle stringhe per le comparazioni. Converti prima la stringa in numero
\"a\" > \"b\"; // false
\"a\" > \"a\"; // false
\"5\" > 3; // true
\"3\" > 3; // false
\"3\" > 5; // false
\"hello\" > 5; // false
5 > \"hello\"; // false
\"5\" > 3n; // true
\"3\" > 5n; // false
5 > 3; // true
3 > 3; // false
3 > 5; // false

Maggiore o uguale: ‌ ‌>=

Con questo simbolo possiamo controllare se un numero è maggiore o uguale ad un altro.
Nel caso i due elementi siano di tipo diverso, verranno convertiti allo stesso tipo.

Sintassi:

a >= b;

Esempi:

// Evita di usare delle stringhe per le comparazioni. Converti prima la stringa in numero
\"a\" >= \"b\"; // false
\"a\" >= \"a\"; // true
\"5\" >= 3; // true
\"3\" >= 3; // true
\"3\" >= 5; // false
\"hello\" >= 5; // false
5 >= \"hello\"; // false
5 >= 3; // true
3 >= 3; // true
3 >= 5; // false

Minore: ‌ ‌<

Con questo simbolo possiamo controllare se un numero è minore di un altro.
Nel caso i due elementi siano di tipo diverso, verranno convertiti allo stesso tipo.

Sintassi:

a < b;

Esempi:

// Evita di usare delle stringhe per le comparazioni. Converti prima la stringa in numero
\"a\" < \"b\"; // true
\"a\" < \"a\"; // false
\"5\" < 3; // false
\"3\" < 3; // false
\"3\" < 5; // true
\"hello\" < 5; // false
5 < \"hello\"; // false
\"5\" < 3n; // false
\"3\" < 5n; // true
5 < 3; // false
3 < 3; // false
3 < 5; // true

Minore o uguale: ‌ ‌<=

Con questo simbolo possiamo controllare se un numero è minore o uguale ad un altro.
Nel caso i due elementi siano di tipo diverso, verranno convertiti allo stesso tipo.

Sintassi:

a <= b;

Esempi:

// Evita di usare delle stringhe per le comparazioni. Converti prima la stringa in numero
\"a\" <= \"b\"; // true
\"a\" <= \"a\"; // true
\"5\" <= 3; // false
\"3\" <= 3; // true
\"3\" <= 5; // true
\"hello\" <= 5; // false
5 <= \"hello\"; // false
\"5\" <= 3n; // false
\"3\" <= 5n; // true
5 <= 3; // false
3 <= 3; // true
3 <= 5; // true

Operatori aritmetici

I seguenti operatori ci permettono di eseguire operazioni aritmetiche.
Tutti i seguenti operatori richiedono operandi con type number, quindi in questo caso dovremo sempre usare dei numeri.

Modulo: ‌ ‌%

Con questo operatore possiamo calcolare il resto della divisione tra due numeri.

Sintassi:

a % b;

Esempi:

12 % 5; // 2
1 % -2; // 1
1 % 2; // 1
2 % 3; // 2
5.5 % 2; // 1.5
-12 % 5; // -2
1 % 2; // -1
4 % 2; // -0
// Infinity e NaN non possono essere usati per le divisioni
// Cos\'è NaN? NaN è l\'acronimo di Not a Number, quindi un valore che non è un numero
NaN % 2; // NaN
Infinity % 2; // NaN
Infinity % 0; // NaN
Infinity % Infinity; // NaN

Incremento: ‌ ‌++

Con questo operatore possiamo aggiungere 1 ad una variabile.
Se l\’operatore precede la variabile, allora viene restituito il valore risultante, in caso contrario viene restituito il vecchio valore.

Sintassi:

a++;
++a;

Esempi:

let x = 3;
y = x++;
// y: 3
// x: 4
let a = 2;
b = ++a;
// a: 3
// b: 3

Decremento: ‌ ‌--

Con questo operatore possiamo levare 1 ad una variabile.
Se l\’operatore precede la variabile, allora viene restituito il valore risultante, in caso contrario viene restituito il vecchio valore.

Sintassi:

a--;
--a;

Esempi:

let x = 3;
y = x--;
// y: 3
// x: 2
let a = 2;
b = --a;
// a: 1
// b: 1

Negazione numerica: ‌ ‌-

Con questo operatore possiamo invertire il segno di una variabile.

Sintassi:

-a;

Esempi:

const x = 3;
const y = -x;
// y: -3
// x: 3
const x = \"4\";
const y = -x;
// y: -4

Più numerico: ‌ ‌+

Questo operatore forza la conversione di un elemento ad un numero. Nel caso questo non sia possibile, NaN viene restituito.
Una valida alternativa a questo operatore è utilizzare Number(a).

Sintassi:

+a;

Esempi:

const x = 1;
const y = -1;
+x; // 1
+y; // -1
+true; // 1
+false; // 0
+function () {
  return 1;
}; // NaN - Le funzioni non possono essere convertite in numero

Operatore esponenziale: ‌ ‌**

Questo operatore eleva un numero a potenza.

Sintassi:

a ** b;

Esempi:

2 ** 3; // 8
3 ** 2; // 9
3 ** 2.5; // 15.588457268119896
10 ** -1; // 0.1
NaN ** 2; // NaN
2 ** (3 ** 2); // 512
2 ** (3 ** 2); // 512
(2 ** 3) ** 2; // 64

Operatori logici

Questi operatori analizzano uno o due operandi qualsiasi e restituiscono uno dei due o un boolean in base a una operazione logica.

AND logico: ‌ ‌&&

L\’operatore logico AND legge la prima espressione e, nel caso sia veritiera, esegue anche la seconda e la restituisce, in caso contrario, restituisce questa prima espressione.
Semplificando il concetto, in un contesto dove abbiamo bisogno di un boolean, come un if, l\’espressione restituita sarà veritiera solo e soltanto se entrambi gli operandi sono veritieri.

Sintassi:

a && b;

Esempi:

function A() {
  console.log(\"called A\");
  return false;
}
function B() {
  console.log(\"called B\");
  return true;
}
A() && B(); // false
// console: \"called A\"
// La funzione `A` restituisce false, perciò l\'operatore && non esegue anche la funzione `B`
true && true; // true
true && false; // false
false && true; // false
false && false; // false
false && \"Cat\"; // false
\"Cat\" && false; // false
\"\" && false; // \"\"
false && \"\"; // false

OR logico: ‌ ‌||

L\’operatore logico OR legge la prima espressione e, nel caso sia veritiera, la restituisce, in caso contrario, esegue e restituisce la seconda.
Semplificando il concetto, in un contesto dove abbiamo bisogno di un boolean, come un if, l\’espressione restituita sarà veritiera se uno degli operandi è veritiero.

Sintassi:

a || b;

Esempi:

function A() {
  console.log(\"called A\");
  return false;
}
function B() {
  console.log(\"called B\");
  return true;
}
A() || B(); // true
// console: \"called A\", \"called B\"
// La funzione `A` restituisce false, perciò l\'operatore || esegue anche la funzione `B`
true || true; // true
false || true; // true
true || false; // true
false || 3 == 4; // false
\"\" || false; // false
false || \"\"; // \"\"

Non-null: ‌ ‌??

L\’operatore non-null legge la prima espressione e, nel caso sia null | undefined, esegue e restituisce la seconda, in caso contrario, restituisce la prima.

Sintassi:

a ?? b;

Esempi:

/**
 * @type {string | null}
 */
const nullValue = null;
const emptyText = \"\"; // non veritiera ma nemmeno nulla
const someNumber = 42;
nullValue ?? \"default for A\"; // \"default for A\"
emptyText ?? \"default for B\"; // \"\" - `\"\"` non è null o undefined
someNumber ?? 0; // 42
function A() {
  console.log(\"A was called\");
  return undefined;
}
function B() {
  console.log(\"B was called\");
  return false;
}
function C() {
  console.log(\"C was called\");
  return \"foo\";
}
A() ?? C(); // \"foo\"
// console: \"A was called\", \"C was called\"
// `A()` ha restituito undefined
// perciò anche`C()` viene eseguito
B() ?? C(); // false
// console: \"B was called\"
// `B()` ha restituito false che non è un valore nullo
// perciò`C()` non viene eseguito

NOT logico: ‌ ‌!

L\’operatore logico NOT legge una sola espressione e restituisce false se l\’espressione è veritiera, o viceversa.
Semplificando il concetto, in un contesto dove abbiamo bisogno di un boolean, come un if, l\’espressione restituita sarà veritiera se l\’operando non è un valore veritiero.

Sintassi:

!a;

Esempi:

!true; // false
!false; // true
!\"\"; // true - `\"\"` non è un valore veritiero perciò viene trattato come false
!\"Cat\"; // false - Una stringa non vuota è un valore veritiero perciò viene trattata come true

Operatori di assegnazione

Questi operatori ci permettono di assegnare valori alle variabili. Vediamo quali sono e come si differenziano.

Assegnazione: ‌ ‌=

L\’uguale è il più semplice operatore di assegnazione ed è utilizzato per assegnare un valore ad una variabile.

Sintassi:

a = b;
const a = b;
let a = b;
// siccome a è stato assegnato con b, a e b saranno uguali e quindi questo codice restituisce sempre b

Esempi:

const x = 5;
let y = 10;
let z;
z = y = x; // 5 - `z` e `y` hanno ora lo stesso valore di `x`
// Equivalente: `z = (y = x)` => `z = (y = 5)` => `z = 5`
// A `y` è stato assegnato il valore di 5 e l\'espressione `y = 5` ha anche restituito 5

Assegnazione con aggiunta: ‌ ‌+=

Con questo operatore possiamo riassegnare ad una variabile lo stesso valore con un aggiunta.

Sintassi:

a += b; // Equivalente: a = a + b

Esempi:

let foo = \"foo\";
let bar = 5;
bar += 2; // 7 - `bar = bar + 2` => `bar = 5 + 2` => `bar = 7`
foo += false; // \"foofalse\"
foo += \"bar\"; // \"foobar\"

Assegnazione con sottrazione: ‌ ‌-=

Questo operatore ci permette di sotrarre uno specifico numero ad una variabile numerica riassegnandola.

Sintassi:

a -= b; // Equivalente: a = a - b

Esempi:

let bar = 5;
bar -= 2; // 3 - `bar = bar - 2` => `bar = 5 - 2` => `bar = 3`

Assegnazione con moltiplicazione: ‌ ‌*=

Questo operatore ci permette di moltiplicare uno specifico numero ad una variabile numerica riassegnandola.

Sintassi:

a *= b; // Equivalente: a = a * b

Esempi:

let bar = 5;
bar *= 2; // 10 - `bar = bar * 2` => `bar = 5 * 2` => `bar = 10`

Assegnazione con divisione: ‌ ‌/=

Questo operatore ci permette di dividere una variabile per uno specifico numero, riassegnandola.

Sintassi:

a /= b; // Equivalente: a = a / b

Esempi:

let bar = 5;
bar /= 2; // 2.5 - `bar = bar / 2` => `bar = 5 / 2` => `bar = 2.5`
bar /= 2; // 1.25
bar /= 0; // Infinity - `bar = bar / 0` => `bar = 1.25 / 0` => `bar = Infinity`
// In JavaScript, qualsiasi numero diviso per 0 è uguale a Infinity

Assegnazione del resto: ‌ ‌%=

Questo operatore ci permette di riassegnare ad una variabile il valore del resto della divisione tra se stessa e un numero.

Sintassi:

a %= b; // Equivalente: a % b

Esempi:

let bar = 5;
bar %= 2; // 1 - `bar = bar % 2` => `bar = 5 % 2` => `bar = 1`
bar %= 0; // NaN - `bar = bar % 0` => `bar = 5 % 0` => `bar = NaN`
// In JavaScript, il modulo di una divisione per 0 è sempre NaN

Assegnazione con elevamento a potenza: ‌ ‌**=

Questo operatore ci permette di elevare a potenza una variabile per uno specifico numero, riassegnandola.

Sintassi:

a **= b; // Equivalente a = a ** b

Esempi:

let bar = 5;
bar **= 2; // 25 - `bar = bar ** 2` => `bar = 5 ** 2` => `bar = 25`

Assegnazione con il logical AND: ‌ ‌&&=

Questo operatore ci permette di riassegnare una variabile ad un valore solo se il vecchio valore di quella variabile è veritiero.

Sintassi:

a &&= b; // Equivalente: a && (a = b)

Esempi:

let x = 0;
let y = 1;
x &&= 0; // 0 - `x && (x = 0)` => `0 && (x = 0)` => `0` - L\'assegnazione non viene eseguita, poichè 0 non è un valore veritiero
x &&= 1; // 0 - `x && (x = 1)` => `0 && (x = 1)` => `0` - \"\"                                                                 \"\"
y &&= 1; // 1 - `y && (y = 1)` => `1 && (y = 1)` => `y = 1` - L\'assegnazione viene eseguita, poichè 1 è un valore veritiero
y &&= 0; // 0 - `y && (y = 0)` => `1 && (y = 0)` => `y = 0` - \"\"                                                         \"\"

Assegnazione con il logical OR: ‌ ‌||=

Questo operatore ci permette di riassegnare una variabile ad un valore solo se il vecchio valore di quella variabile non è veritiero.

Sintassi:

a ||= b; // Equivalente: a || (a = b)

Esempi:

let x = 0;
let y = 1;
x ||= 0; // 0 - `x || (x = 0)` => `0 || (x = 0)` => `x = 0` - L\'assegnazione viene eseguita, poichè 0 non è un valore veritiero
x ||= 1; // 1 - `x || (x = 1)` => `0 || (x = 1)` => `x = 1` - \"\"                                                             \"\"
y ||= 1; // 1 - `y || (y = 1)` => `1 || (y = 1)` => `1` - L\'assegnazione non viene eseguita, poichè 1 è un valore veritiero

Assegnazione con il logical non-null: ‌ ‌??=

Questo operatore ci permette di riassegnare una variabile ad un valore solo se il valore di quella variabile è null o undefined.

Sintassi:

a ??= b; // Equivalente: a ?? (a = b)

Esempi:

let x = null;
let y = 1;
x ??= 0; // 0 - `x ?? (x = 0)` => `null ?? (x = 0)` => `x = 0` - L\'assegnazione viene eseguita, poichè il primo operando è null
x ??= 1; // 0 - `x ?? (x = 1)` => `0 ?? (x = 1)` => `x = 1` - L\'assegnazione non viene eseguita, poichè 0 non è un valore nullo
y ??= 1; // 1 - `y ?? (y = 1)` => `1 ?? (y = 1)` => `1` - L\'assegnazione non viene eseguita, poichè 1 non è un valore nullo

Operatore condizionale ternario

L\’operatore condizionale ternario (Conditional (ternary) operator) è un if...else abbreviato che accetta una condizione da valutare, un\’azione da eseguire quando quella condizione è veritiera e una da eseguire quando non lo è.

Sintassi:

a ? b : c;
// Equivalente:
if (a) b;
else c;

Esempi:

const age = 26;
const adult = age >= 18 ? \"Yes\" : \"No\"; // \"Yes\"
function example() {
  return condition1 ? value1 : condition2 ? value2 : condition3 ? value3 : value4;
}
// Equivalente:
function example() {
  if (condition1) {
    return value1;
  } else if (condition2) {
    return value2;
  } else if (condition3) {
    return value3;
  } else {
    return value4;
  }
}

Operatori singoli

I seguenti operatori vengono utilizzati con un solo operando.

typeof

Questo operatore restituisce il tipo di un elemento.

Sintassi:

typeof a;

Esempi:

// Numbers
typeof 37; // \"number\"
typeof 3.14; // \"number\"
typeof Math.LN2; // \"number\"
typeof Infinity; // \"number\"
typeof NaN; // \"number\"
typeof Number(\"1\"); // \"number\"
typeof Number(\"shoe\"); // \"number\"
typeof 42n; // \"bigint\"
// Strings
typeof \"\"; // \"string\"
typeof \"bla\"; // \"string\"
typeof `template literal`; // \"string\"
typeof \"1\"; // \"string\" - Anche se c\'è un numero è sempre una stringa
typeof typeof 1; // \"string\" - typeof restituisce una stringa
typeof String(1); // \"string\"
// Booleans
typeof true; // \"boolean\"
typeof false; // \"boolean\"
typeof Boolean(1); // \"boolean\"
// Symbols
typeof Symbol(\"foo\"); // \"symbol\"
typeof Symbol.iterator; // \"symbol\"
// Undefined
typeof undefined; // \"undefined\"
// Objects
typeof { a: 1 }; // \"object\"
typeof [1, 2, 4]; // \"object\" - Gli array sono comunque considerati object
typeof new Date(); // \"object\"
typeof /regex/; // \"object\"
typeof null; // \"object\" - ATTENZIONE: null non ha un tipo e viene considerato object
// Functions
typeof function () {}; // \"function\"
typeof class C {}; // \"function\" - Anche le classi sono funzioni
typeof Math.sin; // \"function\"

Operatori di relazione

I seguenti operatori verificano una relazione tra due operandi.
Tutti restituiscono un type boolean.

in

Questo operatore verifica se una proprietà è presente in un object.
Il valore di questo operatore è diverso da quello che ha nel contesto del for...in.

Sintassi:

a in b;

Esempi:

const trees = [\"redwood\", \"bay\", \"cedar\", \"oak\", \"maple\"];
0 in trees; // true
3 in trees; // true
6 in trees; // false
\"bay\" in trees; // false - \"bay\" è un valore, non una proprietà. Usa `Array#includes()` invece.
\"length\" in trees; // true
Symbol.iterator in trees; // true
\"PI\" in Math; // true
const mycar = { make: \"Honda\", model: \"Accord\", year: 1998 };
\"make\" in mycar; // true
\"model\" in mycar; // true

instanceof

Questo operatore verifica se un object è stato instanziato da una classe.

Sintassi:

a instanceof b;

Esempi:

const stringObject = new String(\"String created with constructor\");
stringObject instanceof String; // true
stringObject instanceof Object; // true - Tutti gli object derivano dalla classe `Object`
stringObject instanceof Date; // false
const myDate = new Date();
myDate instanceof Date; // true
myDate instanceof String; // false

---

Lista delle parole chiave

Qui di seguito è riportata una lista delle parole chiave nel JavaScript e della loro funzione.

const / let

const e let sono le parole chiave utilizzate per dichiarare delle variabili.
Vedremo queste parole chiave nel dettaglio in un altro articolo.
const indica una costante, il cui valore è sempre lo stesso e non può essere modificato.
let invece assegna un valore a un\’incognita, che può cambiare nel corso del file js, oppure può essere omesso per assegnare un valore tramite un\’operazione.

Sintassi:

const a 0 b;
let a = b;

Esempi:

const i = 10;
let n = i; // 10
n = 0;
console.log(i, n); // 10, 0

if / else

Questa parola chiave ci permette di eseguire una determinata azione se una condizione è veritiera.

Sintassi:

if (a) {  // Azioni da eseguire se la condizione è veritiera}
// Se vogliamo eseguire solo un\'azione possiamo utilizzare:if (a) b;
if (a) {  // Azioni da eseguire se la condizione è veritiera
} else {  // Azione da eseguire se la condizione NON è veritiera}

Esempi:

if (expr) {  console.log(\"Sì\"); // Se `expr` è un valore veritiero, allora \"Sì\" verrà scritto in console. In caso contrario verrà scritto \"No\"
} else {  console.log(\"No\");}

Espressione veritiera

Un valore è considerato sempre veritiero a meno che non sia uno dei seguenti:

• false;
• 0;
• \" \";
• null;
• undefined;
• NaN;

switch / case / default / break

switch serve per eseguire diverse azioni a seconda di un valore.

Sintassi:

switch (a) {
}
// a è l\'espressione da controllare

Per definire le azioni da eseguire per ogni valore di a utilizziamo la parola case.

Sintassi:

switch (a) {  
case b:  // Azioni da eseguire se il valore di `a` è uguale a quello di `b`  
/* case ...: */}

b e ... : I valori di a. Se a corrisponde a quel valore, allora le azioni dopo i due punti vengono eseguite.

Può essere anche aggiunta un\’azione da eseguire quando il valore di a è diverso da tutti quelli elencati con case. In questo caso utilizziamo la parola default.

Sintassi:

switch (a) {  
case b:  // Azioni da eseguire se il valore di `a` è uguale a quello di `b`  /* case ...: */  
default:  // Azioni da eseguire se il valore di `a` non corrisponde a nessuno di quelli elencati (`b`, `...`)
}

Per far sì che lo switch si fermi dopo aver eseguito le azioni nel case, dobbiamo aggiungere la parola break. Omettendo questa parola alla fine delle azioni il codice nello switch andrà avanti e le azioni nel default verranno eseguite.

Sintassi:

switch (a) {  
case b:    // Azioni da eseguire se il valore di `a` è uguale a quello di `b`    
break;  
/* case ...:        break; 
*/  default:  // Azioni da eseguire se il valore di `a` non corrisponde a nessuno di quelli elencati (`b`, `...`)
}

Esempi:

switch (expr) {  
case \"Banane\":    console.log(\"Le banane costano 2€\"); // Questa azione verrà eseguita se `expr` è \"Banane\"    break;  
case \"Pomodori\":  
case \"Melanzane\":    console.log(\"I pomodori e le melanzane costano 1,50€\"); // Questa azione verrà eseguita se `expr` è \"Pomodori\" o \"Melanzane\"    
break;  
default:    console.log(`Mi dispiace, non abbiamo ${expr}.`);  // Questa azione verrà eseguita se `expr` non è nessuno dei valori sopra indicati}

for / continue

Con la parola chiave for possiamo creare un loop che si basa su 3 espressioni.

Sintassi:

for (a; b; c) {  // Codice da eseguire nel loop}
// Se vogliamo eseguire solo un\'azione possiamo utilizzare:
for (a; b; c) d;

• a: espressione per creare una variabile da utilizzare nel loop. Generalmente si inizializza a 0;
• b: condizione che verrà verificata per decidere se il loop deve continuare o no;
• c: azione da eseguire alla fine di ogni esecuzione del codice nel loop;
• d: singola azione da eseguire nel loop.

Tutte le espressioni sono facoltative ma è comunque obbligatorio aggiungere i punti e virgola. Ometterle tutte crea un loop infinito che va bloccato manualmente.

Nel codice possiamo utilizzare break per uscire dal loop.

Se invece vogliamo passare all\’esecuzione successiva prima che il codice termini possiamo utilizzare la parola continue.

Sintassi:

continue;

Esempi:

let text = \"\"; // Creiamo una stringa vuota
// Creiamo un loop che verrà eseguito 10 volte
for (let i = 0; i < 10; i++) {  if (i === 3) continue; // Se `i` è 3 (quindi siamo alla quarta esecuzione) il codice viene \"saltato\" e si passa alla prossima esecuzione  
text += i; // Ad ogni esecuzione aggiungiamo il numero alla stringa
} console.log(text); 
// \"012456789\" - Il 3 manca perchè lo abbiamo saltato con il continue

while / do . . . while

Un while loop è un loop che esegue una determinata azione finchè una condizione è veritiera. Una specie di for loop / if molto semplificato.

Sintassi:

while (a) {  // Azioni da eseguire quando la condizione `a` è veritiera
} // Se vogliamo eseguire solo un\'azione possiamo utilizzare:
while (a) b;

• a: condizione da verificare prima di ogni esecuzione. Se è veritiera, allora il codice nel loop viene eseguito, in caso contrario il codice va avanti;
• b: azione da eseguire quando a è un\’espressione veritiera

Possiamo affermare che sia l\’equivalente del codice di if / else ma eseguito all\’infinito.

Se vogliamo invece controllare la condizione dopo l\’esecuzione, allora possiamo usare il do...while loop.

Sintassi:

do {  
// Azioni da eseguire nel loop prima di controllare la condizione
} while (a);

Esempi:

let n = 0; // Creiamo una variabile `n` ed assegnamogli il valore 0
// Eseguiamo un loop per 3 volte
while (n < 3) {  n++; 
// Ad ogni esecuzione aumentiamo di 1 la variabile n
} console.log(n); // 3

let str = \"\"; // Creiamo una stringa vuota
let i = 0; // Creiamo una variabile `i` e inizializziamola a 0
do {  i++; // Ad ogni esecuzione aumentiamo di 1 la variabile `i`  
str = str + i; // ed aggiungiamo il valore di `i` alla stringa
} while (i < 5); // Eseguiamo il loop fino a che `i` è minore di 5
console.log(str); // \"12345\"

function / return

La parola chiave function serve per creare una funzione JavaScript.

Vedremo questa struttura nel dettaglio in un altro articolo.

Sintassi:

function a(/* b, ... */) {  // Azioni da eseguire nella funzione
}

• a: nome della funzione da creare;
• b, ... : i parametri della funzione. Sono facoltativi, una funzione può anche non avere parametri.

La funzione verrà poi chiamata nel seguente modo:

a(/* b , ... */);

return indica il valore che verrà restituito dalla funzione.

Sintassi:

return a;

• a: Il valore da restituire. È facoltativo e può essere omesso nel caso non si voglia restituire nessun valore (return;).

Esempi:

/** * @param {number} a * @param {number} b * @param {number} c * @returns {number} */

function sumNumbers(a, b, c) {  
return a + b + c; 
// Restituiamo la somma dei 3 parametri passati nella funzione
}console.log(sumNumbers(2, 4, 6)); // 12 - a,b e c corrispondono quindi a 2,4 e 6 e la funzione ha eseguito la somma di questi tre numeri

/** * @param {unknown} a * @returns {void} */

function log(a) {  console.log(a); 
// Scriviamo il valore passato in console  return; 
// Non restituiamo nulla. Possiamo anche ometterlo in quanto si trova al termine della funzione
} log(\"Sus\"); // \"Sus\"

/** * @returns {void} */

function logSus() {  console.log(\"Sus\"); // Scriviamo \"Sus\" in console  
return; // Non restituiamo nulla. Possiamo anche ometterlo in quanto si trova al termine della funzione
} logSus(); // \"Sus\"

async / await

async viene utilizzato prima della parola function per abilitare l\’uso della parola await all\’interno della funzione.

Se questa parola chiave viene utilizzata, la funzione restituirà sicuramente una Promise, il cui valore da restituire sarà quello restituito dalla funzione.

Sintassi:

async function a(/* b, ... */) {  
// Azioni da eseguire nella funzione. È possibile utilizzare la parola chiave `await`
}

await viene usato prima di una Promise per far sì che il codice corrente si blocchi fino a che quella Promise non viene completata.

Sintassi:

await a; // a é la Promise, ovvero l\'azione da eseguire

Esempi:

/** * @param {number} m * @returns {Promise<number>} */

async function wait(m) {  const date = Date.now(); // Registriamo la data quando la funzione viene chiamata  

await new Promise((resolve) => setTimeout(resolve, m));  // Attendiamo tanti millisecondi quanti ne sono stati passati come parametro `m` nella funzione  
const passed = Date.now() - date; // Registriamo quanto tempo è passato da quando la funzione è stata chiamata  console.log(passed); // ~1000  
return passed; // Restituiamo quel valore.  // Nonostante sia un numero la funzione restituirà una `Promise` poiché abbiamo utilizzato la parola async
}console.log(wait(1000)); // Promise { <pending> }

try . . . catch

Le parole try e catch servono per eseguire una determinata azione nel caso si verifichi un errore nel codice.

Sintassi:

try {  // Codice da provare
} catch (a) {  // Azioni da eseguire se il codice sopra ha prodotto un errore. a è il nome da assegnare alla variabile che conterrà l\'errore.
}

Esempi:

const a = \"Sus\";
try {  
console.log(b);
} catch (error) {  console.error(error); 
// ReferenceError: b is not defined}

throw

Con la parola throw possiamo generare un errore e bloccare il codice corrente.

Funziona alla stessa maniera di return, ma con la differenza che invece di restituire un valore comunica all\’utente che un errore si è verificato e il codice non può continuare. Per far si che il processo in corso continui bisogna gestire l\’errore utilizzando un try...catch block.

Sintassi:

throw a;

• a: L\’errore da generare. Può essere qualsiasi valore, ma è obbligatorio.

Esempi:

// Creiamo una funzione che calcola l\'area di un rettangolo con base e altezza

function getArea(width, height) {
// Controlliamo se base e altezza sono numeri
if (isNaN(width) || isNaN(height)) {
    throw \"Non hai fornito numeri validi!\"; // In caso contrario generiamo un errore
  }
}

try {
  getArea(3, \"A\"); 
// Chiamiamo la funzione, ma, invece di passare un numero, passiamo \"A\", che farà generare un errore
} catch (e) {
  console.error(e); // \"Non hai fornito numeri validi!\"
}

---

Conclusione

In questo articolo abbiamo visto molte funzioni utili del JavaScript.

Con gli operatori potremo eseguire tutti i nostri calcoli, controlli etc… in modo estremamente facile mentre, grazie alle parole chiave, possiamo implementare nel nostro codice qualsiasi cosa, come loop, con for e while, azioni differenti in base a condizioni, con if...else o salvare dei valori, con const e let.

Nel prossimo articolo andremo più a fondo con le variabili per imparare come dichiararle correttamente e cambiarne il valore.