Esercitazione JS

JS CASA JS Introduzione JS Dove si va Uscita JS Dichiarazioni JS Sintassi JS Commenti JS Variabili JS JS Let JS Cost Operatori JS JS aritmetica Assegnazione JS Tipi di dati JS Funzioni JS Oggetti JS Eventi JS Corde JS Metodi di stringa JS Ricerca di stringhe JS Modelli di stringhe JS Numeri JS Metodi numerici JS Matrici JS Metodi array JS Ordinamento matrice JS Iterazione dell'array JS Cost. array JS Date JS Formati data JS Metodi di acquisizione della data JS Metodi di impostazione della data JS JS matematica JS Casuale JS booleani Confronti JS Condizioni JS JS Switch Ciclo JS per JS Loop per In Ciclo JS per di JS Loop mentre JS Break Iterabili JS Insiemi JS Mappe JS Tipo JS Conversione del tipo JS JS bit a bit JS RegExp Errori JS Ambito JS JS sollevamento Modalità rigorosa JS JS questa parola chiave Funzione freccia JS Classi JS JS JSON Debug JS Guida allo stile JS Migliori Pratiche JS Errori di JS Prestazioni JS Parole riservate JS

Versioni JS

Versioni JS JS 2009 (ES5) JS 2015 (ES6) JS 2016 JS 2017 JS 2018 JS IE / Edge Storia di JS

Oggetti JS

Definizioni di oggetti Proprietà dell'oggetto Metodi dell'oggetto Visualizzazione di oggetti Accessori per oggetti Costruttori di oggetti Prototipi di oggetti Iterabili di oggetti Insiemi di oggetti Mappe degli oggetti Riferimento all'oggetto

Funzioni JS

Definizioni delle funzioni Parametri di funzione Invocazione di funzione Chiamata di funzione Funzione Applica Chiusure di funzioni

Classi JS

Introduzione alla classe Eredità di classe Classe statica

JS Async

Richiamate JS JS asincrono JS Promesse JS Async/Attendere

JS HTML DOM

DOM Introduzione Metodi DOM Documento DOM Elementi DOM DOM HTML Moduli DOM DOM CSS Animazioni DOM Eventi DOM Ascoltatore di eventi DOM Navigazione DOM Nodi DOM Collezioni DOM Elenchi di nodi DOM

Distinta base del browser JS

Finestra JS Schermo JS Posizione JS Storia di JS Navigatore JS Avviso popup JS JS tempismo Biscotti JS

API Web JS

Introduzione all'API Web API dei moduli Web API Cronologia web API di archiviazione Web API Web Worker API di recupero Web API di geolocalizzazione web

JS AJAX

Introduzione all'Ajax AJAX XMLHttp Richiesta AJAX Risposta dell'AJAX File XML AJAX AJAX PHP AJAX ASP Database AJAX Applicazioni AJAX Esempi AJAX

JS JSON

Introduzione JSON Sintassi JSON JSON contro XML Tipi di dati JSON Analisi JSON JSON Stringify Oggetti JSON Matrici JSON Server JSON JSON PHP JSON HTML JSON JSONP

JS vs jQuery

Selettori jQuery jQuery HTML jQuery CSS jQuery DOM

Grafica JS

Grafica JS Tela JS JS Plotly JS Chart.js Grafico di Google JS JS D3.js

Esempi JS

Esempi JS JS HTML DOM Input HTML JS Oggetti HTML JS Eventi HTML JS Browser JS Editore JS Esercizi JS Quiz J.S Certificato JS

Riferimenti JS

Oggetti JavaScript Oggetti HTML DOM


Funzioni JavaScript


Una funzione JavaScript è un blocco di codice progettato per eseguire un'attività particolare.

Una funzione JavaScript viene eseguita quando "qualcosa" la invoca (la chiama).


Esempio

function myFunction(p1, p2) {
  return p1 * p2;   // The function returns the product of p1 and p2
}

Sintassi della funzione JavaScript

Una funzione JavaScript è definita con la functionparola chiave, seguita da un nome , seguito da parentesi () .

I nomi delle funzioni possono contenere lettere, cifre, trattini bassi e segni di dollaro (stesse regole delle variabili).

Le parentesi possono includere i nomi dei parametri separati da virgole:
( parametro1, parametro2, ... )

Il codice da eseguire, dalla funzione, è racchiuso tra parentesi graffe: {}

function name(parameter1, parameter2, parameter3) {
  // code to be executed
}

I parametri della funzione sono elencati tra parentesi () nella definizione della funzione.

Gli argomenti della funzione sono i valori ricevuti dalla funzione quando viene richiamata.

All'interno della funzione, gli argomenti (i parametri) si comportano come variabili locali.

Una funzione è più o meno la stessa di una procedura o di una subroutine, in altri linguaggi di programmazione.


Invocazione di funzione

Il codice all'interno della funzione verrà eseguito quando "qualcosa" invoca (chiama) la funzione:

  • Quando si verifica un evento (quando un utente fa clic su un pulsante)
  • Quando viene invocato (chiamato) dal codice JavaScript
  • Automaticamente (auto-invocato)

Imparerai molto di più sull'invocazione delle funzioni più avanti in questo tutorial.



Funzione Ritorno

Quando JavaScript raggiunge returnun'istruzione, la funzione interrompe l'esecuzione.

Se la funzione è stata invocata da un'istruzione, JavaScript "ritornerà" per eseguire il codice dopo l'istruzione di richiamo.

Le funzioni spesso calcolano un valore restituito . Il valore restituito viene "restituito" al "chiamante":

Esempio

Calcola il prodotto di due numeri e restituisce il risultato:

let x = myFunction(4, 3);   // Function is called, return value will end up in x

function myFunction(a, b) {
  return a * b;             // Function returns the product of a and b
}

Il risultato in x sarà:

12

Perché le funzioni?

Puoi riutilizzare il codice: definisci il codice una volta e usalo più volte.

È possibile utilizzare lo stesso codice più volte con argomenti diversi, per produrre risultati diversi.

Esempio

Converti Fahrenheit in Celsius:

function toCelsius(fahrenheit) {
  return (5/9) * (fahrenheit-32);
}
document.getElementById("demo").innerHTML = toCelsius(77);

L'operatore () richiama la funzione

Utilizzando l'esempio precedente, toCelsiusfa riferimento all'oggetto funzione e toCelsius()fa riferimento al risultato della funzione.

L'accesso a una funzione senza () restituirà l'oggetto funzione invece del risultato della funzione.

Esempio

function toCelsius(fahrenheit) {
  return (5/9) * (fahrenheit-32);
}
document.getElementById("demo").innerHTML = toCelsius;

Funzioni usate come valori di variabile

Le funzioni possono essere utilizzate allo stesso modo delle variabili, in tutti i tipi di formule, assegnazioni e calcoli.

Esempio

Invece di usare una variabile per memorizzare il valore di ritorno di una funzione:

let x = toCelsius(77);
let text = "The temperature is " + x + " Celsius";

Puoi usare la funzione direttamente, come valore di variabile:

let text = "The temperature is " + toCelsius(77) + " Celsius";

Imparerai molto di più sulle funzioni più avanti in questo tutorial.


Variabili locali

Le variabili dichiarate all'interno di una funzione JavaScript, diventano LOCALI per la funzione.

È possibile accedere alle variabili locali solo dall'interno della funzione.

Esempio

// code here can NOT use carName

function myFunction() {
  let carName = "Volvo";
  // code here CAN use carName
}

// code here can NOT use carName

Poiché le variabili locali vengono riconosciute solo all'interno delle loro funzioni, le variabili con lo stesso nome possono essere utilizzate in funzioni diverse.

Le variabili locali vengono create all'avvio di una funzione ed eliminate al completamento della funzione.


Mettiti alla prova con gli esercizi

Esercizio:

Eseguire la funzione denominata myFunction.

function myFunction() {
  alert("Hello World!");
}
;