Skip to content

Commit aad22b5

Browse files
authored
Merge pull request #194 from pasor1/article/07-new-function
The "new Function" syntax
2 parents ef5f201 + 5da493b commit aad22b5

File tree

4 files changed

+56
-58
lines changed

4 files changed

+56
-58
lines changed

1-js/05-data-types/04-array/article.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -495,7 +495,7 @@ Gli array sono uno speciale tipo di oggetto, studiati per immagazzinare e gestir
495495
- La proprietà `length` è la lunghezza dell'array, in realtà per essere precisi, contiene l'indice dell'ultimo elemento più uno. Questo valore viene aggiornato automaticamente.
496496
- Se decrementiamo manualmente `length`, l'array viene troncato.
497497

498-
Possiamo utilizzare un array come deque con le seguenti operazioni:
498+
Possiamo eseguire sugli arrays le seguenti operazioni:
499499

500500
- `push(...items)` aggiunge `items` in coda.
501501
- `pop()` rimuove un elemento dalla coda e lo ritorna.
Lines changed: 36 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -1,56 +1,56 @@
11

2-
# The "new Function" syntax
2+
# La sintassi "new Function"
33

4-
There's one more way to create a function. It's rarely used, but sometimes there's no alternative.
4+
Esiste un ulteriore modo per creare una funzione. E' raramente utilizzato, ma a volte è l'unica alternativa.
55

6-
## Syntax
6+
## Sintassi
77

8-
The syntax for creating a function:
8+
La sintassi per la creazione di una funzione con questo metodo è la seguente:
99

1010
```js
1111
let func = new Function ([arg1, arg2, ...argN], functionBody);
1212
```
1313

14-
The function is created with the arguments `arg1...argN` and the given `functionBody`.
14+
La funzione viene creata con gli argomenti `arg1...argN` ed il corpo `functionBody`.
1515

16-
It's easier to understand by looking at an example. Here's a function with two arguments:
16+
E' più semplice da comprendere guardando un esempio. Nel seguente abbiamo una funzione con due argomenti:
1717

1818
```js run
1919
let sum = new Function('a', 'b', 'return a + b');
2020

2121
alert( sum(1, 2) ); // 3
2222
```
2323

24-
And here there's a function without arguments, with only the function body:
24+
In quest'altro esempio, invece, non abbiamo argomenti, c'è solo il corpo della funzione:
2525

2626
```js run
2727
let sayHi = new Function('alert("Hello")');
2828

2929
sayHi(); // Hello
3030
```
3131

32-
The major difference from other ways we've seen is that the function is created literally from a string, that is passed at run time.
32+
La differenza dalle altre modalità di creazione delle funzioni che abbiamo visto, è che qui la funzione viene creata letteralmente da una stringa, che viene passata in fase di esecuzione.
3333

34-
All previous declarations required us, programmers, to write the function code in the script.
34+
Tutte le dichiarazioni di funzione precedenti richiedevano di scrivere il codice della funzione nello script.
3535

36-
But `new Function` allows to turn any string into a function. For example, we can receive a new function from a server and then execute it:
36+
Ma `new Function` ci permette di trasformare qualsiasi stringa in una funzione. Per esempio potremmo ricevere una nuova funzione da un server e quindi eseguirla:
3737

3838
```js
39-
let str = ... receive the code from a server dynamically ...
39+
let str = ... riceviamo il codice della funzione dinamicamente, da un server ...
4040

4141
let func = new Function(str);
4242
func();
4343
```
4444

45-
It is used in very specific cases, like when we receive code from a server, or to dynamically compile a function from a template, in complex web-applications.
45+
Viene utilizzato in casi molto specifici, come quando riceviamo del codice da un server, o per compilare dinamicamente una funzione da un modello, in applicazioni web complesse.
4646

47-
## Closure
47+
## Closure (chiusura)
4848

49-
Usually, a function remembers where it was born in the special property `[[Environment]]`. It references the Lexical Environment from where it's created (we covered that in the chapter <info:closure>).
49+
Di solito, una funzione memorizza dove è nata nella proprietà speciale `[[Environment]]`. Questa fa riferimento al Lexical Environment in cui è stata creata (lo abbiamo trattato nel capitolo <info:closure>).
5050

51-
But when a function is created using `new Function`, its `[[Environment]]` is set to reference not the current Lexical Environment, but the global one.
51+
Ma quando una funzione viene creata con `new Function`, il suo `[[Environment]]` non fa riferimento all'attuale Lexical Environment, ma a quello globale.
5252

53-
So, such function doesn't have access to outer variables, only to the global ones.
53+
Quindi, tale funzione non ha accesso alle variabili esterne, ma solo a quelle globali.
5454

5555
```js run
5656
function getFunc() {
@@ -66,7 +66,7 @@ function getFunc() {
6666
getFunc()(); // error: value is not defined
6767
```
6868

69-
Compare it with the regular behavior:
69+
Confrontiamolo con il normale comportamento:
7070

7171
```js run
7272
function getFunc() {
@@ -79,45 +79,43 @@ function getFunc() {
7979
return func;
8080
}
8181

82-
getFunc()(); // *!*"test"*/!*, from the Lexical Environment of getFunc
82+
getFunc()(); // *!*"test"*/!*, dal Lexical Environment di getFunc
8383
```
8484

85-
This special feature of `new Function` looks strange, but appears very useful in practice.
85+
Questa caratteristica speciale di `new Function` sembra strana, ma si rivela molto utile nella pratica.
8686

87-
Imagine that we must create a function from a string. The code of that function is not known at the time of writing the script (that's why we don't use regular functions), but will be known in the process of execution. We may receive it from the server or from another source.
87+
Immaginiamo di dover creare una funzione da una stringa. Il codice di questa funzione è sconosciuto nel momento in cui scriviamo lo script (per questo non usiamo i normali metodi), ma lo conosceremo durante l'esecuzione. Potremmo riceverlo dal server o da un'altra fonte.
8888

89-
Our new function needs to interact with the main script.
89+
La nostra nuova funzione ha bisogno di interagire con lo script principale.
9090

91-
What if it could access the outer variables?
91+
E se potesse accedere alle variabili esterne?
9292

93-
The problem is that before JavaScript is published to production, it's compressed using a *minifier* -- a special program that shrinks code by removing extra comments, spaces and -- what's important, renames local variables into shorter ones.
93+
Il problema è che, prima che JavaScript venga messo in produzione, viene spesso compresso utilizzando un *minifier*, ossia un programma speciale che riduce il codice rimuovendo commenti, spazi e, cosa importante, rinominando le variabili locali utilizzando nomi più brevi.
9494

95-
For instance, if a function has `let userName`, minifier replaces it with `let a` (or another letter if this one is occupied), and does it everywhere. That's usually a safe thing to do, because the variable is local, nothing outside the function can access it. And inside the function, minifier replaces every mention of it. Minifiers are smart, they analyze the code structure, so they don't break anything. They're not just a dumb find-and-replace.
95+
Ad esempio, se una funzione contiene `let userName`, il minifier lo sostituisce con `let a` (o con un'altra lettera se questa è già occupata), e lo fa ovunque. Solitamente è una procedura sicura: poiché la variabile è locale, nulla al di fuori della funzione può accedervi. Mentre all'interno della funzione il minifier sostituisce ogni sua menzione. I minifiers sono intelligenti, analizzano la struttura del codice e non rompono nulla. Non sono degli stupidi trova-e-sostituisci.
9696

97-
So if `new Function` had access to outer variables, it would be unable to find renamed `userName`.
97+
Quindi se `new Function` avesse accesso alle variabili esterne, non sarebbe in grado di trovare la variabile `userName` rinominata.
9898

99-
**If `new Function` had access to outer variables, it would have problems with minifiers.**
99+
**Se `new Function` avesse accesso alle variabili esterne, ci sarebbero problemi con i minifiers.**
100100

101-
Besides, such code would be architecturally bad and prone to errors.
101+
Inoltre, tale codice sarebbe pessimo dal punto di vista architetturale e soggetto ad errori.
102102

103-
To pass something to a function, created as `new Function`, we should use its arguments.
103+
Per passare qualcosa a una funzione, creata con `new Function`, dovremmo usare i suoi argomenti.
104104

105-
## Summary
105+
## Riepilogo
106106

107-
The syntax:
107+
La sintassi:
108108

109109
```js
110110
let func = new Function ([arg1, arg2, ...argN], functionBody);
111111
```
112+
Per ragioni storiche, gli argomenti possono anche essere passati come elenco separato da virgole.
112113

113-
For historical reasons, arguments can also be given as a comma-separated list.
114-
115-
These three declarations mean the same:
114+
Queste tre dichiarazioni hanno lo stesso significato:
116115

117116
```js
118-
new Function('a', 'b', 'return a + b'); // basic syntax
119-
new Function('a,b', 'return a + b'); // comma-separated
120-
new Function('a , b', 'return a + b'); // comma-separated with spaces
117+
new Function('a', 'b', 'return a + b'); // sintassi base
118+
new Function('a,b', 'return a + b'); // elenco separato da virgola
119+
new Function('a , b', 'return a + b'); // elenco separato da virgola e spazio
121120
```
122-
123-
Functions created with `new Function`, have `[[Environment]]` referencing the global Lexical Environment, not the outer one. Hence, they cannot use outer variables. But that's actually good, because it insures us from errors. Passing parameters explicitly is a much better method architecturally and causes no problems with minifiers.
121+
Nelle funzioni create con `new Function`, `[[Environment]]` fa riferimento al Lexical Environment globale, non a quello esterno. Quindi queste funzioni non possono utilizzare variabili esterne. In realtà ciò è un bene perché ci mette al riparo da errori. Passare i parametri in modo esplicito è un metodo migliore dal punto di vista architetturale e non causa problemi con i minifiers.

1-js/09-classes/01-class/article.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -154,7 +154,7 @@ Ci sono però delle importanti differenze.
154154
}
155155

156156
alert(typeof User); // funzione
157-
User(); // Errore: Il costruttore della classe può essere riciamato solo attraverso 'new'
157+
User(); // Errore: Il costruttore della classe può essere richiamato solo attraverso 'new'
158158
```
159159

160160
Inoltre, nella maggior parte dei motori JavaScript il costruttore comincia con "class"
@@ -368,7 +368,7 @@ Ci sono due differenti approcci per affrontare questo problema, come discusso ne
368368
1. Passare una funzione contenitore, come `setTimeout(() => button.click(), 1000)`.
369369
2. Associare il metodo all'oggetto, e.g. nel costruttore.
370370

371-
I campi di una classe fornicono un'altra sintassi molto più elegante:
371+
I campi di una classe forniscono un'altra sintassi molto più elegante:
372372

373373
```js run
374374
class Button {
@@ -391,7 +391,7 @@ Il campo della classe `click = () => {...}` viene creato per ogni oggetto, abbia
391391

392392
Questo è particolarmente utile in ambiente browser, per gli event listeners (ascoltatori di eventi).
393393

394-
## Riepilog
394+
## Riepilogo
395395

396396
Il seguente esempio riporta la sintassi base di una classe:
397397

1-js/09-classes/02-class-inheritance/article.md

Lines changed: 16 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,7 @@ QUi vediamo come rappresentare l'oggetto `animal` e la classe `Animal` graficame
3232

3333
...Potremmo voler creare un'altra `class Rabbit`.
3434

35-
Poichè i conigli sono animali, la classe `Rabbit` dovrebbe essere basata su `Animal`, avendo accesso a tutti i metodi di `Animal`, in questo modo `Rabbit` può assumere tutti i comportamenti di base di un `Animal`.
35+
Poiché i conigli sono animali, la classe `Rabbit` dovrebbe essere basata su `Animal`, avendo accesso a tutti i metodi di `Animal`, in questo modo `Rabbit` può assumere tutti i comportamenti di base di un `Animal`.
3636

3737
La sintassi utilizzate per estendere un'altra classe è: `class Child extends Parent`.
3838

@@ -64,7 +64,7 @@ Ad esempio, per trovare il metodo `rabbit.run`, il motore JavaScript controlla (
6464
2. Il suo prototype, che è `Rabbit.prototype` (possiede `hide`, ma non `run`).
6565
3. Il suo prototype, che è (a causa di `extends`) `Animal.prototype`, che possiede il metodo `run`.
6666

67-
Come ricordiamo dal capitolo <info:native-prototypes>, JavaScript stesso usa l'ereditarietà per prototipi per gli oggetti integrati. E.g. `Date.prototype.[[Prototype]]` è `Object.prototype`. Questo è il motoivo per cui le date hanno accesso ai metodi generici di un oggetto.
67+
Come ricordiamo dal capitolo <info:native-prototypes>, JavaScript stesso usa l'ereditarietà per prototipi per gli oggetti integrati. E.g. `Date.prototype.[[Prototype]]` è `Object.prototype`. Questo è il motivo per cui le date hanno accesso ai metodi generici di un oggetto.
6868

6969
````smart header="Qualsiasi espressione è ammessa dopo `extend`"
7070
Usare la parola chiave `class` permette di specificare non solo una classe, ma anche un'espressione dopo la parola `extends`.
@@ -230,9 +230,9 @@ Ops! Abbiamo ricevuto un errore. Ora non possiamo creare conigli (rabbits). Cosa
230230

231231
La risposta breve è:
232232

233-
- **I costruttori nelle classi che ereditano devono chiamare `super(...)`, e bisongna farlo (!) prima di utilizzare `this`.**
233+
- **I costruttori nelle classi che ereditano devono chiamare `super(...)`, e bisogna farlo (!) prima di utilizzare `this`.**
234234

235-
...Ma perchè? Cosa sta succedendo?
235+
...Ma perché? Cosa sta succedendo?
236236
In effetti, questa richiesta sembra un po' strana.
237237

238238
Ovviamente una spiegazione c'è. Addentriamoci nei dettagli, così da capire cosa effettivamente succede.
@@ -284,14 +284,14 @@ alert(rabbit.earLength); // 10
284284
```warn header="Nota avanzata"
285285
Questa nota assume che voi abbiate una certa esperienza con le classi, anche in altri linguaggi di programmazione.
286286
287-
Fornisce una spiegazione più dettagliata del linguaggio e ne illustra il comportamente che potrebbe essere fonte di errori (anche se molto rari).
287+
Fornisce una spiegazione più dettagliata del linguaggio e ne illustra il comportamento che potrebbe essere fonte di errori (anche se molto rari).
288288
289289
Se trovate questa sezione troppo difficile da capire, saltatela pure, continuate a leggere, e rileggetela in un secondo momento.
290290
```
291291

292292
In una sotto-classe possiamo estendere non solo i metodi, ma anche i campi di classe.
293293

294-
Anche se, si verifica un comportamento strano quando proviamo ad accedere ad un campo sovrascritto nel costruttore padre, piuttosto differente da altri linguaggi di programmazzione.
294+
Anche se, si verifica un comportamento strano quando proviamo ad accedere ad un campo sovrascritto nel costruttore genitore, piuttosto differente da altri linguaggi di programmazione.
295295

296296
Consideriamo questi esempio:
297297

@@ -318,7 +318,7 @@ Qui, la classe `Rabbit` estende `Animal` e sovrascrive il campo `name` con il su
318318

319319
Non c'è alcun costruttore in `Rabbit`, quindi viene invocato quello di `Animal`.
320320

321-
E' interessante notare che in entrambi i casi: `new Animal()` e `new Rabbit()`, l'istruzion di `alert` nella riga `(*)` mostra `animal`.
321+
E' interessante notare che in entrambi i casi: `new Animal()` e `new Rabbit()`, l'istruzione di `alert` nella riga `(*)` mostra `animal`.
322322

323323
**In altre parole, il costruttore genitore utilizza sempre i suoi campi dati, non quelli sovrascritti.**
324324

@@ -353,33 +353,33 @@ new Rabbit(); // rabbit
353353

354354
Notiamo che l'output è differente.
355355

356-
E questo è quello che ci aspetteremo. Quando il costrutore genitore viene invocato da una classe derivata, utilizzate i metodi sovrascritti.
356+
E questo è quello che ci aspetteremmo. Quando il costruttore genitore viene invocato da una classe derivata, utilizzate i metodi sovrascritti.
357357

358358
...Ma per i campi dati non è cosi. Come già detto, il costruttore genitore utilizza sempre i suoi campi dati.
359359

360-
Perchè c'è questa differenza?
360+
Perché c'è questa differenza?
361361

362-
Il motivo sta nell'ordine di inizializzazione dei campi dati. I campi dati di una classe vengono inizializati:
362+
Il motivo sta nell'ordine di inizializzazione dei campi dati. I campi dati di una classe vengono inizializzati:
363363
- Prima del costruttore per la classe base,
364364
- Subito dopo `super()` per le classi derivate.
365365

366366
Nel nostro caso, `Rabbit` è la classe derivata. Non c'è alcun `constructor()` al suo interno. Come detto precedentemente, questo equivale ad avere un costruttore vuoto con la sola chiamata a `super(...args)`.
367367

368-
Quindi, `new Rabbit()` invoca `super()`, che esegue il costruttore genitore, e (per le regole che segue la classe derivata) solamente dopo vengono inizializzati i suoi campi dati. Al momento dell'esecuziono del costruttore genitore, non esiste alcun capo dato in `Rabbit`, questo è il motivo per cui vengono utilizzati i campi dati di `Animal`.
368+
Quindi, `new Rabbit()` invoca `super()`, che esegue il costruttore genitore, e (per le regole che segue la classe derivata) solamente dopo vengono inizializzati i suoi campi dati. Al momento dell'esecuzione del costruttore genitore, non esiste alcun capo dato in `Rabbit`, questo è il motivo per cui vengono utilizzati i campi dati di `Animal`.
369369

370370
Abbiamo quindi una sottile differenza di trattamento tra i campi dati ed i metodi in JavaScript.
371371

372-
Fortunatamente, questo comportamente si verifica solamente se un campo dati va a sovrascrivere quelli della classe genitore. Potrebber e essere difficile da capire come comportamente, per questo lo abbiamo speigato qui.
372+
Fortunatamente, questo comportamento si verifica solamente se un campo dati va a sovrascrivere quelli della classe genitore. Potrebbe essere difficile da capire come comportamento, per questo lo abbiamo spiegato.
373373

374374
Se dovesse verificarsi questo problema, si possono utilizzare i metodi invece dei campi dati.
375375

376376

377377
## Super: internamente, [[HomeObject]]
378378

379379
```warn header="Informazioni avanzate"
380-
Se state leggengo il tutorial per la prima volta - questa sezione può essere saltata.
380+
Se state leggendo il tutorial per la prima volta - questa sezione può essere saltata.
381381
382-
Qui spiegeremo i meccanisci interni che stanno dietro l'ereditarietà e `super`.
382+
Qui spiegheremo i meccanismi interni che stanno dietro l'ereditarietà e `super`.
383383
```
384384

385385
Andiamo un pò più a fondo del metodo `super`. Scopriremo alcune cose interessanti a riguardo.
@@ -610,12 +610,12 @@ rabbit.eat(); // Errore nella chiamata a super (dato che [[HomeObject non esist
610610
## Riepilogo
611611
612612
1. Per estendere una classe: `class Child extends Parent`:
613-
- Questo significa che `Child.prototype.__proto__` dventerà `Parent.prototype`, quindi i metodi vengono ereditati.
613+
- Questo significa che `Child.prototype.__proto__` diventerà `Parent.prototype`, quindi i metodi vengono ereditati.
614614
2. Quando sovrascriviamo un costruttore:
615615
- Dobbiamo richiamare il costruttore del padre attraverso `super()` nel costruttore di `Child` prima di utilizzare `this`.
616616
3. Quando sovrascriviamo un metodo:
617617
- Possiamo usare `super.method()` in un metodo di `Child` per richiamare il metodo da `Parent`.
618-
4. Meccaniscmi interni:
618+
4. Meccanismi interni:
619619
- I metodi tengono traccia del loro oggetto o della loro classe nella proprietà `[[HomeObject]]`, così da poter utilizzare `super` per accedere ai metodi della classe padre.
620620
- Non è quindi sicuro copiare un metodo in un altro oggetto attraverso `super`.
621621

0 commit comments

Comments
 (0)