SlideShare una empresa de Scribd logo
1 de 11
Descargar para leer sin conexión
Corso Data Journalist gen-mar 2017
TECNOLOGIE WEB AVANZATO
Esecuzione asincrona
Funzioni closure e callback
Costruzione di una funzione
Dichiarazione tramite il comando function
var SUM= function(N1,N2){
// This function does sum of two number
console.log('Sum is running')
S=N1+N2;
return S
}
Assegnazione ad una variabile
function SUM(N1,N2){
// This function does sum of two number
console.log('Sum is running')
S=N1+N2;
return S
}
Medesima chiamata
SUM(12,34)
In un programma è possibile inserire la
chiamata della funzione prima della sua
costruzione
E’ possibile utilizzare una funzione come
parametro di un’altra funzione
E’ possibile vedere questo caso come
l’assegnazione di una funzione anonima ad una
variabile/indirizzo di memoria
Funzioni autoeseguite - 1
( function() {return 'Hello'; } ) () ; E’ eseguita immediatamente
var TESTO='Questo è un testo';
(function(TESTO){console.log(TESTO);})();
console.log(TESTO);
Produce un errore perchè la funzione è
eseguita prima dell’assegnazione alla
variabile TESTO
Funzioni autoeseguite - 2
var FUNC1= (function(){
var WORD
return function(WORD){console.log('****** ',WORD)};
})();
Il risultato di una funzione autoeseguita può essere a sua
volta una funzione
Ambito (scope) delle variabili: la parola chiave var
Programma Main
Ambito globale
var NUM1=10
var STR1=’Hello’
Funzione Elab(N1,N2)
Ambito locale
var E1, E2, RIS;
E1=N1*N2-100
E2=30*(N2-N1)
RIS=E1/E2
return RIS
Ambito globale
TEXT=’Testo globale’
Funzioni closure (variabili private) - 1
Obiettivo: vogliamo costruire una funzione Add che lanciata in qualunque punto del
programma incrementi di uno il contatore COUNT
Soluzione debole (variabile globale COUNT)
var COUNT= 0;
function Add() {
COUNT=COUNT+1
}
Il problema: tutti i programmi possono
modificare COUNT;
Soluzione sbagliata (variabile locale COUNT)
function Add() {
var COUNT= 0;
COUNT=COUNT+1
}
Il problema: tutte le volte che eseguo Add(),
COUNT assume il valore 1;
Funzioni closure (variabili private) - 2
Soluzione ottima (funzione closure): costruisco una funzione che si auto-invoca,
con una variabile locale COUNT e che restituisce una funzione che incrementa
COUNT
var Add = ( function () {
var COUNT = 0;
return function () {return COUNT=COUNT+1;}
}) ( );
dopo l’esecuzione del programma:
COUNT è una variabile locale di Add()
Add()={return COUNT=COUNT+1;}
Funzione callback: l’esigenza
function FP1(ARG1, ARG2){
var SUM = ARG1+ARG2;
return SUM}
function FP2(TEXT){
console.log("****" + TEXT);}
var SOMMA=FP1(15,5)
FP2(SOMMA)
Si consideri le seguenti dichiarazioni
di due funzioni
e la loro esecuzione
Poichè le istruzioni javascript sono eseguite in modo asincrono, non è
garantito che la seconda chiamata sia eseguita dopo la prima. Nel caso in
cui questo non avvenisse, il programma produce un errore.
Funzione callback: la soluzione
function FP(ARG1, ARG2, CallBack){
//parte 1
var SUM = ARG1+ARG2;
//parte 2
CallBack(SUM) }
FP(15,5, function(T){
console.log("****" +T);
} )
Si consideri la seguente funzioni e la sua esecuzione
In questo caso, la funzione rappresentata dalla parte2 verrà sempre
eseguita dopo la parte 1
LEZIONE 1..
www.fordatascientist.org
I00-Web-Advanced
I01-FunctionAsObject.ipynb
CONTATTI TELEFONO
051 22 35 20
EMAIL
WORKSHOP@VICEM.IT

Más contenido relacionado

Destacado

Web advanced-11-d3 js
Web advanced-11-d3 jsWeb advanced-11-d3 js
Web advanced-11-d3 jsStudiabo
 
Python advanced 01-numpypandas
Python advanced 01-numpypandasPython advanced 01-numpypandas
Python advanced 01-numpypandasStudiabo
 
Python base 10-strutturadati
Python base 10-strutturadatiPython base 10-strutturadati
Python base 10-strutturadatiStudiabo
 
Python advanced 06-matplotlib
Python advanced 06-matplotlibPython advanced 06-matplotlib
Python advanced 06-matplotlibStudiabo
 
Web advanced-03-d3 js-base
Web advanced-03-d3 js-baseWeb advanced-03-d3 js-base
Web advanced-03-d3 js-baseStudiabo
 
Кратчайшая история JavaScript
Кратчайшая история JavaScriptКратчайшая история JavaScript
Кратчайшая история JavaScriptPavel Klimiankou
 
Python advanced 07-pandas-plot
Python advanced 07-pandas-plotPython advanced 07-pandas-plot
Python advanced 07-pandas-plotStudiabo
 
Python advanced 08-gis
Python advanced 08-gisPython advanced 08-gis
Python advanced 08-gisStudiabo
 
Web advanced-02-jquery
Web advanced-02-jqueryWeb advanced-02-jquery
Web advanced-02-jqueryStudiabo
 
Web base-05-js-object
Web base-05-js-objectWeb base-05-js-object
Web base-05-js-objectStudiabo
 
Python base 07-classioggetti
Python base 07-classioggettiPython base 07-classioggetti
Python base 07-classioggettiStudiabo
 
Python advanced 03-multiindex
Python advanced 03-multiindexPython advanced 03-multiindex
Python advanced 03-multiindexStudiabo
 
Python advanced 02-dataframe
Python advanced 02-dataframePython advanced 02-dataframe
Python advanced 02-dataframeStudiabo
 
Web base-01-html
Web base-01-htmlWeb base-01-html
Web base-01-htmlStudiabo
 
Python advanced 20-classioggetti-sintesi
Python advanced 20-classioggetti-sintesiPython advanced 20-classioggetti-sintesi
Python advanced 20-classioggetti-sintesiStudiabo
 
Python base 01-numeristringhe
Python base 01-numeristringhePython base 01-numeristringhe
Python base 01-numeristringheStudiabo
 
Designers from Hell / Freelance Day 2015
Designers from Hell / Freelance Day 2015Designers from Hell / Freelance Day 2015
Designers from Hell / Freelance Day 2015Sketchin
 
Web advanced-10-svg
Web advanced-10-svgWeb advanced-10-svg
Web advanced-10-svgStudiabo
 

Destacado (20)

Web advanced-11-d3 js
Web advanced-11-d3 jsWeb advanced-11-d3 js
Web advanced-11-d3 js
 
Python advanced 01-numpypandas
Python advanced 01-numpypandasPython advanced 01-numpypandas
Python advanced 01-numpypandas
 
Python base 10-strutturadati
Python base 10-strutturadatiPython base 10-strutturadati
Python base 10-strutturadati
 
Python advanced 06-matplotlib
Python advanced 06-matplotlibPython advanced 06-matplotlib
Python advanced 06-matplotlib
 
Web advanced-03-d3 js-base
Web advanced-03-d3 js-baseWeb advanced-03-d3 js-base
Web advanced-03-d3 js-base
 
Кратчайшая история JavaScript
Кратчайшая история JavaScriptКратчайшая история JavaScript
Кратчайшая история JavaScript
 
Sane Async Patterns
Sane Async PatternsSane Async Patterns
Sane Async Patterns
 
Python advanced 07-pandas-plot
Python advanced 07-pandas-plotPython advanced 07-pandas-plot
Python advanced 07-pandas-plot
 
Python advanced 08-gis
Python advanced 08-gisPython advanced 08-gis
Python advanced 08-gis
 
Web advanced-02-jquery
Web advanced-02-jqueryWeb advanced-02-jquery
Web advanced-02-jquery
 
Web base-05-js-object
Web base-05-js-objectWeb base-05-js-object
Web base-05-js-object
 
Python base 07-classioggetti
Python base 07-classioggettiPython base 07-classioggetti
Python base 07-classioggetti
 
Python advanced 03-multiindex
Python advanced 03-multiindexPython advanced 03-multiindex
Python advanced 03-multiindex
 
Python advanced 02-dataframe
Python advanced 02-dataframePython advanced 02-dataframe
Python advanced 02-dataframe
 
Web base-01-html
Web base-01-htmlWeb base-01-html
Web base-01-html
 
Python advanced 20-classioggetti-sintesi
Python advanced 20-classioggetti-sintesiPython advanced 20-classioggetti-sintesi
Python advanced 20-classioggetti-sintesi
 
Python base 01-numeristringhe
Python base 01-numeristringhePython base 01-numeristringhe
Python base 01-numeristringhe
 
Designers from Hell / Freelance Day 2015
Designers from Hell / Freelance Day 2015Designers from Hell / Freelance Day 2015
Designers from Hell / Freelance Day 2015
 
Web advanced-10-svg
Web advanced-10-svgWeb advanced-10-svg
Web advanced-10-svg
 
Why use slideshare
Why use slideshareWhy use slideshare
Why use slideshare
 

Similar a Web advanced-01-asincrono

Reactive programming principles
Reactive programming principlesReactive programming principles
Reactive programming principlesRiccardo Cardin
 
Javascript - 7 | WebMaster & WebDesigner
Javascript - 7 | WebMaster & WebDesignerJavascript - 7 | WebMaster & WebDesigner
Javascript - 7 | WebMaster & WebDesignerMatteo Magni
 
Lezione 12 (28 marzo 2012)
Lezione 12 (28 marzo 2012)Lezione 12 (28 marzo 2012)
Lezione 12 (28 marzo 2012)STELITANO
 
Lezione 12 (28 marzo 2012)
Lezione 12 (28 marzo 2012)Lezione 12 (28 marzo 2012)
Lezione 12 (28 marzo 2012)STELITANO
 
Javascript - 7 | WebMaster & WebDesigner
Javascript - 7 | WebMaster & WebDesignerJavascript - 7 | WebMaster & WebDesigner
Javascript - 7 | WebMaster & WebDesignerMatteo Magni
 
Fare con Zend Framework 2 ciò che facevo con ZF1
Fare con Zend Framework 2 ciò che facevo con ZF1Fare con Zend Framework 2 ciò che facevo con ZF1
Fare con Zend Framework 2 ciò che facevo con ZF1Steve Maraspin
 
Two months of Kotlin
Two months of KotlinTwo months of Kotlin
Two months of KotlinErik Minarini
 
06 Android - lavorare in background
06 Android - lavorare in background06 Android - lavorare in background
06 Android - lavorare in backgroundspawn150
 
The Hitchhiker's Guide to testable code: semplici regole per scrivere codice ...
The Hitchhiker's Guide to testable code: semplici regole per scrivere codice ...The Hitchhiker's Guide to testable code: semplici regole per scrivere codice ...
The Hitchhiker's Guide to testable code: semplici regole per scrivere codice ...Davide Cerbo
 
JavaScript Object Oriented
JavaScript Object OrientedJavaScript Object Oriented
JavaScript Object OrientedManuel Scapolan
 
Introduzione a Node.js
Introduzione a Node.jsIntroduzione a Node.js
Introduzione a Node.jsMichele Capra
 

Similar a Web advanced-01-asincrono (20)

7 Sottoprogrammi
7   Sottoprogrammi7   Sottoprogrammi
7 Sottoprogrammi
 
Reactive programming principles
Reactive programming principlesReactive programming principles
Reactive programming principles
 
Javascript - 7 | WebMaster & WebDesigner
Javascript - 7 | WebMaster & WebDesignerJavascript - 7 | WebMaster & WebDesigner
Javascript - 7 | WebMaster & WebDesigner
 
Programmazione Top Down in C++
Programmazione Top Down in C++Programmazione Top Down in C++
Programmazione Top Down in C++
 
La metodologia Top - Down - applicazione al C++
La metodologia Top - Down - applicazione al C++La metodologia Top - Down - applicazione al C++
La metodologia Top - Down - applicazione al C++
 
Lezione 12 (28 marzo 2012)
Lezione 12 (28 marzo 2012)Lezione 12 (28 marzo 2012)
Lezione 12 (28 marzo 2012)
 
Lezione 12 (28 marzo 2012)
Lezione 12 (28 marzo 2012)Lezione 12 (28 marzo 2012)
Lezione 12 (28 marzo 2012)
 
Javascript - 7 | WebMaster & WebDesigner
Javascript - 7 | WebMaster & WebDesignerJavascript - 7 | WebMaster & WebDesigner
Javascript - 7 | WebMaster & WebDesigner
 
La scomposizione in sotto programmi in C++.pptx
La scomposizione in sotto programmi in C++.pptxLa scomposizione in sotto programmi in C++.pptx
La scomposizione in sotto programmi in C++.pptx
 
Fare con Zend Framework 2 ciò che facevo con ZF1
Fare con Zend Framework 2 ciò che facevo con ZF1Fare con Zend Framework 2 ciò che facevo con ZF1
Fare con Zend Framework 2 ciò che facevo con ZF1
 
08 mapreduce
08   mapreduce08   mapreduce
08 mapreduce
 
iContract
iContractiContract
iContract
 
Two months of Kotlin
Two months of KotlinTwo months of Kotlin
Two months of Kotlin
 
06 Android - lavorare in background
06 Android - lavorare in background06 Android - lavorare in background
06 Android - lavorare in background
 
The Hitchhiker's Guide to testable code: semplici regole per scrivere codice ...
The Hitchhiker's Guide to testable code: semplici regole per scrivere codice ...The Hitchhiker's Guide to testable code: semplici regole per scrivere codice ...
The Hitchhiker's Guide to testable code: semplici regole per scrivere codice ...
 
Scomposizione di programmi e approccio in visual basic
Scomposizione di programmi e approccio in visual basicScomposizione di programmi e approccio in visual basic
Scomposizione di programmi e approccio in visual basic
 
JavaScript Object Oriented
JavaScript Object OrientedJavaScript Object Oriented
JavaScript Object Oriented
 
Introduzione a node.js
Introduzione a node.jsIntroduzione a node.js
Introduzione a node.js
 
Introduzione a Node.js
Introduzione a Node.jsIntroduzione a Node.js
Introduzione a Node.js
 
Java lezione 10
Java lezione 10Java lezione 10
Java lezione 10
 

Más de Studiabo

Big data rischi
Big data rischiBig data rischi
Big data rischiStudiabo
 
Big data correlazioni
Big data correlazioniBig data correlazioni
Big data correlazioniStudiabo
 
Ravenna2019 - lezione Big Data
Ravenna2019 - lezione Big DataRavenna2019 - lezione Big Data
Ravenna2019 - lezione Big DataStudiabo
 
Strutture dati 08-reshape
Strutture dati 08-reshapeStrutture dati 08-reshape
Strutture dati 08-reshapeStudiabo
 
Strutture dati 07-multiindex
Strutture dati 07-multiindexStrutture dati 07-multiindex
Strutture dati 07-multiindexStudiabo
 
Strutture dati 06-dataframe
Strutture dati 06-dataframeStrutture dati 06-dataframe
Strutture dati 06-dataframeStudiabo
 
Strutture dati 05-numpypandas
Strutture dati 05-numpypandasStrutture dati 05-numpypandas
Strutture dati 05-numpypandasStudiabo
 
Strutture dati 04-funzionicustom-classioggetti
Strutture dati 04-funzionicustom-classioggettiStrutture dati 04-funzionicustom-classioggetti
Strutture dati 04-funzionicustom-classioggettiStudiabo
 
Strutture dati 03-stutturedatibuiltin
Strutture dati 03-stutturedatibuiltinStrutture dati 03-stutturedatibuiltin
Strutture dati 03-stutturedatibuiltinStudiabo
 
Strutture dati 02-strutturecontrollo-funzionibuiltin
Strutture dati 02-strutturecontrollo-funzionibuiltinStrutture dati 02-strutturecontrollo-funzionibuiltin
Strutture dati 02-strutturecontrollo-funzionibuiltinStudiabo
 
Strutture dati 01-numeristringhe
Strutture dati 01-numeristringheStrutture dati 01-numeristringhe
Strutture dati 01-numeristringheStudiabo
 
Strutture dati 00-corso2018-2019
Strutture dati 00-corso2018-2019Strutture dati 00-corso2018-2019
Strutture dati 00-corso2018-2019Studiabo
 
Pres ulisse acciaio-ottobre2018
Pres ulisse acciaio-ottobre2018Pres ulisse acciaio-ottobre2018
Pres ulisse acciaio-ottobre2018Studiabo
 
Strutture dati 08-reshape
Strutture dati 08-reshapeStrutture dati 08-reshape
Strutture dati 08-reshapeStudiabo
 
Pres ulisse acciaio-aprile2018
Pres ulisse acciaio-aprile2018Pres ulisse acciaio-aprile2018
Pres ulisse acciaio-aprile2018Studiabo
 
Strutture dati 02-strutturecontrollo-funzionibuiltin
Strutture dati 02-strutturecontrollo-funzionibuiltinStrutture dati 02-strutturecontrollo-funzionibuiltin
Strutture dati 02-strutturecontrollo-funzionibuiltinStudiabo
 
Strutture dati 07-multiindex
Strutture dati 07-multiindexStrutture dati 07-multiindex
Strutture dati 07-multiindexStudiabo
 
Strutture dati 05-numpypandas
Strutture dati 05-numpypandasStrutture dati 05-numpypandas
Strutture dati 05-numpypandasStudiabo
 
Strutture dati 06-dataframe
Strutture dati 06-dataframeStrutture dati 06-dataframe
Strutture dati 06-dataframeStudiabo
 
Strutture dati 04-funzionicustom-classioggetti
Strutture dati 04-funzionicustom-classioggettiStrutture dati 04-funzionicustom-classioggetti
Strutture dati 04-funzionicustom-classioggettiStudiabo
 

Más de Studiabo (20)

Big data rischi
Big data rischiBig data rischi
Big data rischi
 
Big data correlazioni
Big data correlazioniBig data correlazioni
Big data correlazioni
 
Ravenna2019 - lezione Big Data
Ravenna2019 - lezione Big DataRavenna2019 - lezione Big Data
Ravenna2019 - lezione Big Data
 
Strutture dati 08-reshape
Strutture dati 08-reshapeStrutture dati 08-reshape
Strutture dati 08-reshape
 
Strutture dati 07-multiindex
Strutture dati 07-multiindexStrutture dati 07-multiindex
Strutture dati 07-multiindex
 
Strutture dati 06-dataframe
Strutture dati 06-dataframeStrutture dati 06-dataframe
Strutture dati 06-dataframe
 
Strutture dati 05-numpypandas
Strutture dati 05-numpypandasStrutture dati 05-numpypandas
Strutture dati 05-numpypandas
 
Strutture dati 04-funzionicustom-classioggetti
Strutture dati 04-funzionicustom-classioggettiStrutture dati 04-funzionicustom-classioggetti
Strutture dati 04-funzionicustom-classioggetti
 
Strutture dati 03-stutturedatibuiltin
Strutture dati 03-stutturedatibuiltinStrutture dati 03-stutturedatibuiltin
Strutture dati 03-stutturedatibuiltin
 
Strutture dati 02-strutturecontrollo-funzionibuiltin
Strutture dati 02-strutturecontrollo-funzionibuiltinStrutture dati 02-strutturecontrollo-funzionibuiltin
Strutture dati 02-strutturecontrollo-funzionibuiltin
 
Strutture dati 01-numeristringhe
Strutture dati 01-numeristringheStrutture dati 01-numeristringhe
Strutture dati 01-numeristringhe
 
Strutture dati 00-corso2018-2019
Strutture dati 00-corso2018-2019Strutture dati 00-corso2018-2019
Strutture dati 00-corso2018-2019
 
Pres ulisse acciaio-ottobre2018
Pres ulisse acciaio-ottobre2018Pres ulisse acciaio-ottobre2018
Pres ulisse acciaio-ottobre2018
 
Strutture dati 08-reshape
Strutture dati 08-reshapeStrutture dati 08-reshape
Strutture dati 08-reshape
 
Pres ulisse acciaio-aprile2018
Pres ulisse acciaio-aprile2018Pres ulisse acciaio-aprile2018
Pres ulisse acciaio-aprile2018
 
Strutture dati 02-strutturecontrollo-funzionibuiltin
Strutture dati 02-strutturecontrollo-funzionibuiltinStrutture dati 02-strutturecontrollo-funzionibuiltin
Strutture dati 02-strutturecontrollo-funzionibuiltin
 
Strutture dati 07-multiindex
Strutture dati 07-multiindexStrutture dati 07-multiindex
Strutture dati 07-multiindex
 
Strutture dati 05-numpypandas
Strutture dati 05-numpypandasStrutture dati 05-numpypandas
Strutture dati 05-numpypandas
 
Strutture dati 06-dataframe
Strutture dati 06-dataframeStrutture dati 06-dataframe
Strutture dati 06-dataframe
 
Strutture dati 04-funzionicustom-classioggetti
Strutture dati 04-funzionicustom-classioggettiStrutture dati 04-funzionicustom-classioggetti
Strutture dati 04-funzionicustom-classioggetti
 

Web advanced-01-asincrono

  • 1. Corso Data Journalist gen-mar 2017 TECNOLOGIE WEB AVANZATO Esecuzione asincrona Funzioni closure e callback
  • 2. Costruzione di una funzione Dichiarazione tramite il comando function var SUM= function(N1,N2){ // This function does sum of two number console.log('Sum is running') S=N1+N2; return S } Assegnazione ad una variabile function SUM(N1,N2){ // This function does sum of two number console.log('Sum is running') S=N1+N2; return S } Medesima chiamata SUM(12,34) In un programma è possibile inserire la chiamata della funzione prima della sua costruzione E’ possibile utilizzare una funzione come parametro di un’altra funzione E’ possibile vedere questo caso come l’assegnazione di una funzione anonima ad una variabile/indirizzo di memoria
  • 3. Funzioni autoeseguite - 1 ( function() {return 'Hello'; } ) () ; E’ eseguita immediatamente var TESTO='Questo è un testo'; (function(TESTO){console.log(TESTO);})(); console.log(TESTO); Produce un errore perchè la funzione è eseguita prima dell’assegnazione alla variabile TESTO
  • 4. Funzioni autoeseguite - 2 var FUNC1= (function(){ var WORD return function(WORD){console.log('****** ',WORD)}; })(); Il risultato di una funzione autoeseguita può essere a sua volta una funzione
  • 5. Ambito (scope) delle variabili: la parola chiave var Programma Main Ambito globale var NUM1=10 var STR1=’Hello’ Funzione Elab(N1,N2) Ambito locale var E1, E2, RIS; E1=N1*N2-100 E2=30*(N2-N1) RIS=E1/E2 return RIS Ambito globale TEXT=’Testo globale’
  • 6. Funzioni closure (variabili private) - 1 Obiettivo: vogliamo costruire una funzione Add che lanciata in qualunque punto del programma incrementi di uno il contatore COUNT Soluzione debole (variabile globale COUNT) var COUNT= 0; function Add() { COUNT=COUNT+1 } Il problema: tutti i programmi possono modificare COUNT; Soluzione sbagliata (variabile locale COUNT) function Add() { var COUNT= 0; COUNT=COUNT+1 } Il problema: tutte le volte che eseguo Add(), COUNT assume il valore 1;
  • 7. Funzioni closure (variabili private) - 2 Soluzione ottima (funzione closure): costruisco una funzione che si auto-invoca, con una variabile locale COUNT e che restituisce una funzione che incrementa COUNT var Add = ( function () { var COUNT = 0; return function () {return COUNT=COUNT+1;} }) ( ); dopo l’esecuzione del programma: COUNT è una variabile locale di Add() Add()={return COUNT=COUNT+1;}
  • 8. Funzione callback: l’esigenza function FP1(ARG1, ARG2){ var SUM = ARG1+ARG2; return SUM} function FP2(TEXT){ console.log("****" + TEXT);} var SOMMA=FP1(15,5) FP2(SOMMA) Si consideri le seguenti dichiarazioni di due funzioni e la loro esecuzione Poichè le istruzioni javascript sono eseguite in modo asincrono, non è garantito che la seconda chiamata sia eseguita dopo la prima. Nel caso in cui questo non avvenisse, il programma produce un errore.
  • 9. Funzione callback: la soluzione function FP(ARG1, ARG2, CallBack){ //parte 1 var SUM = ARG1+ARG2; //parte 2 CallBack(SUM) } FP(15,5, function(T){ console.log("****" +T); } ) Si consideri la seguente funzioni e la sua esecuzione In questo caso, la funzione rappresentata dalla parte2 verrà sempre eseguita dopo la parte 1
  • 11. CONTATTI TELEFONO 051 22 35 20 EMAIL WORKSHOP@VICEM.IT