Contenuto principale
Corso: Programmazione > Unità 1
Lesson 9: FunzioniRipasso: Funzioni
Questo è un ripasso di ciò che abbiamo visto nel tutorial sulle funzioni.
Spesso, quando scriviamo i programmi, vogliamo essere in grado di eseguire più volte dei blocchi di codice, senza dover riscrivere tutto il codice. Abbiamo bisogno di un modo per raggruppare il codice e dargli un nome, in modo da poterlo chiamare in seguito usando quel nome. Questo è ciò che si chiama funzione.
Per creare una funzione, in primo luogo dobbiamo dichiararla e assegnarle un nome, analogamente a ciò che facciamo per creare una variabile, e poi segue la definizione della funzione:
var sayHello = function() {
};Dentro la funzione possiamo mettere il codice che vogliamo - un'istruzione, più istruzioni - dipende da cosa vogliamo fare. Con questa funzione possiamo far apparire un messaggio in una posizione random:
var sayHello = function() {
text("Halllllllo!", random(200), random(200));
};Ma se ci limitiamo a dichiarare la funzione, non accadrà nulla. Perché il programma esegua il codice che è all'interno della funzione, dobbiamo effettivamente "chiamare" la funzione, scrivendo il suo nome seguito da parentesi vuote:
sayHello();E poi possiamo chiamarla quando vogliamo, tutte le volte che vogliamo!
sayHello();
sayHello();
sayHello();Spesso vogliamo personalizzare le funzioni, per dire al programma: "Beh, esegui tutto questo codice, ma cambia alcune cose." In questo modo avremo del codice riutilizzabile e flessibile: non esiste nulla di meglio. Per averlo, possiamo specificare gli "argomenti" della funzione, e utilizzare tali argomenti per modificare il funzionamento della funzione, passandoli alla funzione quando la chiamiamo.
Ad esempio, come facciamo se vogliamo poter dire esattamente dove vogliamo che il messaggio sia visualizzato, proprio come quando diamo la posizione di rect() e ellipse()? Potremmo immaginare di chiamare la nostra funzione in questo modo, per avere il messaggio nella posizione precisa data dalle due coordinate:
sayHello(50, 100);
sayHello(150, 200);Per farlo funzionare, dobbiamo modificare la definizione della nostra funzione
sayHello, in modo che sappia che riceverà 2 argomenti e che li utilizzi al suo interno:var sayHello = function(xPos, yPos) {
text("Halllllllo!", xPos, yPos);
};Gli argomenti che vengono passati vengono trattati fondamentalmente come variabili all'interno della definizione della funzione, e i nomi dipendono da come li chiami tu nelle parentesi. Li abbiamo rinominati in modo che siano più brevi:
var sayHello = function(x, y) {
text("Halllllllo!", x, y);
};Le nostre funzioni possono accettare un numero qualsiasi di argomenti - zero, uno, due o più. Possiamo anche modificare la nostra funzione in modo che accetti un nome a cui rivolgere il saluto:
var sayHello = function(name) {
text("Halllllllo, " + name, random(200), random(200));
};E poi possiamo chiamarla in questo modo:
sayHello("Winston");
sayHello("Pamela");Possiamo mettere insieme queste idee e fare in modo che la funzione prenda tre argomenti, per il nome e per la posizione:
var sayHello = function(name, x, y) {
text("Halllllllo " + name, x, y);
};E poi chiamarla in questo modo:
sayHello("Winston", 10, 100);Dipende molto da cosa vuoi che le tue funzioni facciamo, e da quanto desideri personalizzare ciò che possono fare. Puoi sempre iniziare senza argomenti e aggiungerli in seguito quando ti rendi conto che ti servono.
Per tutto questo tempo hai chiamato funzioni: in questo modo hai creato disegni e animazioni, con
rect, ellipse, triangle, ecc. Tutte queste funzioni vengono dalla libreria ProcessingJS, e le carichiamo in ogni programma che crei qui, in modo che potrai sempre utilizzarle. Abbiamo definito le funzioni per te, perché abbiamo pensato che sarebbe stato utile, e ora tocca a te decidere quali funzioni personalizzate vuoi usare nei tuoi programmi. Per esempio, ti abbiamo dato la funzione ellipse, ma non ti abbiamo dato una funzione cat: se il tuo programma riguardasse molti gatti in molti posti diversi, forse dovresti creare una tua funzione cat!Ecco un'altra cosa potente che possiamo fare con le funzioni: possiamo usare per prendere dei valori, fare dei calcoli e restituire un nuovo valore. Pensa a tutto ciò che puoi fare con una calcolatrice: sommare, sottrarre, calcolare le radici quadrate, moltiplicare, eccetera. Tutto questo può essere fatto con le funzioni che prendono degli input e restituiscono il risultato. Le funzioni prendono come input gli argomenti e restituiscono il risultato usando un' istruzione return. Ecco una funzione che somma due numeri e restituisce il risultato:
var addNumbers = function(num1, num2) {
var result = num1 + num2;
return result;
};
var sum = addNumbers(5, 2);
text(sum, 200, 200); // Displays "7"L' istruzione return fa due cose: restituisce un valore a chi l'ha chiamata (per questo abbiamo potuto salvarlo nella variabile
sum) ed esce immediatamente dalla funzione. Perciò sarebbe stupido avere qualcosa di questo tipo, perché l'ultima riga non verrebbe mai eseguita:var addNumbers = function(num1, num2) {
var result = num1 + num2;
return result;
result = result * 2; // silly!
};Le funzioni che restituiscono valori sono molto utili per manipolare i dati nei programmi e possono anche essere combinate insieme nelle espressioni:
var biggerSum = addNumbers(2, 5) + addNumbers(3, 2);Puoi anche chiamare le funzioni dentro le chiamate delle funzioni, anche se a volte un codice di questo tipo può essere difficile da leggere:
var hugeSum = addNumbers(addNumbers(5, 2), addNumbers(3, 7));Ora che sai come creare delle funzioni che raggruppino un blocco di codice, dobbiamo affrontare un concetto importante: variabili locali e variabili globali.
Quando dichiariamo una nuova variabile dentro una funzione, diciamo che è locale per quella funzione. Questo perché solo quella funzione potrà vedere la variabile: il resto del programma fuori dalla funzione non la vedrà. Fuori dalla funzione, è come se la variabile non esistesse più. Nella funzione seguente,
localResult è una variabile locale:var addNumbers = function(num1, num2) {
var localResult = num1 + num2;
println("The local result is: " + localResult);
return localResult;
};
addNumbers(5, 7);
println(localResult); // oh noes!Quando eseguiamo questo codice, otteniamo un errore nella riga finale: "localResult is not defined." La variabile è definita solo all'interno della funzione, perché è lì che l'abbiamo dichiarata con la riga
var localResult =, e non è definita al di fuori.Quando dichiariamo una variabile fuori dalle nostre funzioni, diciamo che è una variabile globale. Questo perché tutte le funzioni ora possono accedervi e fare ciò che vogliono con la variabile.
var globalResult;
var addNumbers = function(num1, num2) {
globalResult = num1 + num2;
println("The global result is: " + globalResult);
};
addNumbers(5, 7);
println(globalResult);Quando eseguiamo il codice qui sopra, non otteniamo errori, perché abbiamo dichiarato la variabile
globalResult fuori dalla funzione, quindi possiamo accedervi da dove vogliamo.Ogni linguaggio di programmazione è diverso, ma per JavaScript è importante sapere che le variabili hanno quello che si chiama "function scope": una funzione può vedere le variabili locali che sono state dichiarate all'interno di essa e le variabili globali che sono state dichiarate di fuori di essa, ma non può vedere le variabili locali all'interno di altre funzioni.
Vuoi unirti alla conversazione?
buongiorno a tantissime grazie per tutto
non mi spiego come definire gli argomenti di una funzione
se prendo ad esempio questa funzione
var sayHello = function(xPos, yPos)
come fa javascript a capire che i due argomenti solo il valore di x e y ?
grazie Alberto
grazie Alberto(2 voti)
Salve,
in questo caso xPos e yPos risultano essere i parametri della funzione sayHello, javascript però non li interpreterà come due coordinate, li considera semplicemente dei numeri con i quali andrà ad effettuare operazioni all'interno della funzione stessa.
Per fare un esempio, qualora volessimo che il nostro programma mostrasse un testo con coordinate sempre diverse, avremmo una sintassi del genere:var sayHello = function(xPos, yPos) {
text("Ciao Alberto!", xPos, yPos);
};
sayHello(200, 200);
sayHello(250, 150);
La funzione text richiede che vengano specificate delle coordinate x e y per sapere dove posizionare il testo, richiamando la funzione sayHello e specificando i due parametri(rispettivamente xPos e yPos) siamo in grado di fornire tutto il necessario alla funzione text(presente all'interno di sayHello) per posizionare il testo dove desideriamo.(2 voti)
sono molto felice ma non per khan accademia ma per un altra cosa(1 voto)