You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
A [File](https://www.w3.org/TR/FileAPI/#dfn-file)object inherits from `Blob`and is extended with filesystem-related capabilities.
3
+
Un oggetto di tipo [File](https://www.w3.org/TR/FileAPI/#dfn-file)eredita da `Blob`e lo estende con funzionalità legate al filesystem.
4
4
5
-
There are two ways to obtain it.
5
+
Ci sono due modi per costruirlo.
6
6
7
-
First, there's a constructor, similar to`Blob`:
7
+
Il primo, utilizzando il costruttore, molto simile a`Blob`:
8
8
9
9
```js
10
10
newFile(fileParts, fileName, [options])
11
11
```
12
12
13
-
-**`fileParts`** -- is an array of Blob/BufferSource/String values.
14
-
-**`fileName`** -- file name string.
15
-
-**`options`** -- optional object:
16
-
-**`lastModified`** -- the timestamp (integer date) of last modification.
13
+
-**`fileParts`**, è un array di valori di tipo Blob/BufferSource/String.
14
+
-**`fileName`** - il nome del file.
15
+
-**`options`**, oggetto opzionale:
16
+
-**`lastModified`**, il timestamp dell'ultima modifica (un intero).
17
17
18
-
Second, more often we get a file from`<input type="file">` or drag'n'drop or other browser interfaces. In that case, the file gets this information from OS.
18
+
Il secondo modo si applica quando otteniamo un file tramite`<input type="file">`, con il drag'n'drop o con altre interfacce browser. In questo caso, il file prende le informazioni dal sistema operativo.
19
19
20
-
As`File`inherits from`Blob`, `File`objects have the same properties, plus:
21
-
-`name` -- the file name,
22
-
-`lastModified` -- the timestamp of last modification.
20
+
Poiché`File`eredita da`Blob`, gli oggetti di tipo `File`possiedono le stesse proprietà, con l'aggiunta di:
21
+
-`name`, il nome del file,
22
+
-`lastModified`, il timestamp dell'ultima modifica.
23
23
24
-
That's how we can get a `File`object from`<input type="file">`:
24
+
Vediamo come ottenere un oggetto `File`tramite`<input type="file">`:
25
25
26
26
```html run
27
27
<inputtype="file"onchange="showFile(this)">
@@ -37,49 +37,49 @@ function showFile(input) {
37
37
```
38
38
39
39
```smart
40
-
The input may select multiple files, so `input.files` is an array-like object with them. Here we have only one file, so we just take `input.files[0]`.
40
+
Tramite l'input è possibile selezionare più file, quindi `input.files` è un array. In questo caso abbiamo solamente un file, quindi è sufficiente prendere `input.files[0]`.
41
41
```
42
42
43
43
## FileReader
44
44
45
-
[FileReader](https://www.w3.org/TR/FileAPI/#dfn-filereader)is an object with the sole purpose of reading data from `Blob` (and hence `File` too) objects.
45
+
[FileReader](https://www.w3.org/TR/FileAPI/#dfn-filereader)è un oggetto il cui unico scopo è quello di leggere dati da oggetti di tipo `Blob` (e quindi anche da quelli di tipo `File`).
46
46
47
-
It delivers the data using events, as reading from disk may take time.
47
+
Questo fornisce i dati utilizzando gli eventi, in quanto la lettura da disco potrebbe richiedere tempo.
48
48
49
-
The constructor:
49
+
Il suo costruttore:
50
50
51
51
```js
52
52
let reader =newFileReader(); // no arguments
53
53
```
54
54
55
-
The main methods:
55
+
I metodi principali:
56
56
57
-
-**`readAsArrayBuffer(blob)`** -- read the data in binary format`ArrayBuffer`.
58
-
-**`readAsText(blob, [encoding])`** -- read the data as a text string with the given encoding (`utf-8`by default).
59
-
-**`readAsDataURL(blob)`** -- read the binary data and encode it as base64 data url.
60
-
-**`abort()`** -- cancel the operation.
57
+
-**`readAsArrayBuffer(blob)`**, legge i dati in formato binario da`ArrayBuffer`.
58
+
-**`readAsText(blob, [encoding])`**, legge i dati come stringa di testo con uno specifico encoding (`utf-8`di default).
59
+
-**`readAsDataURL(blob)`**, legge i dati in formato binario e li codifica come URL in base64.
60
+
-**`abort()`**, annulla l'operazione.
61
61
62
-
The choice of `read*`method depends on which format we prefer, how we're going to use the data.
62
+
La scelta di quale metodo di `read*`utilizzare dipende molto dal formato che preferiamo utilizzare, e a come andremo ad utilizzare i dati.
63
63
64
-
-`readAsArrayBuffer` -- for binary files, to do low-level binary operations. For high-level operations, like slicing, `File`inherits from`Blob`, so we can call them directly, without reading.
65
-
-`readAsText` -- for text files, when we'd like to get a string.
66
-
-`readAsDataURL` -- when we'd like to use this data in `src`for `img`or another tag. There's an alternative to reading a file for that, as discussed in chapter<info:blob>: `URL.createObjectURL(file)`.
64
+
-`readAsArrayBuffer`, per file di tipo binario, per eseguire operazioni a basso livello. Per operazioni ad alto livello, come la rimozione di porzioni di file, `File`eredita da`Blob`, quindi possiamo invocare i suoi metodi direttamente, senza iniziare la lettura.
65
+
-`readAsText`, per file di tipo testuale, per ottenerli sotto forma di stringa.
66
+
-`readAsDataURL`, quando siamo interessati da utilizzare questi dati come `src`su un `img`o un altro tag. In questo caso c'è un ulteriore alternativa , che abbiamo discusso nel capitolo<info:blob>: `URL.createObjectURL(file)`.
67
67
68
-
As the reading proceeds, there are events:
69
-
-`loadstart` -- loading started.
70
-
-`progress` -- occurs during reading.
71
-
-`load` -- no errors, reading complete.
72
-
-`abort` --`abort()` called.
73
-
-`error` -- error has occurred.
74
-
-`loadend` -- reading finished with either success or failure.
68
+
Mentre il processo di lettura prosegue, vengono emessi degli eventi:
69
+
-`loadstart`, la lettura è iniziata.
70
+
-`progress`, durante la lettura.
71
+
-`load`, nessun errore, lettura completata.
72
+
-`abort`, invocato`abort()`.
73
+
-`error`, si è verificato un errore.
74
+
-`loadend`, lettura completata con o senza errori.
75
75
76
-
When the reading is finished, we can access the result as:
77
-
-`reader.result`is the result (if successful)
78
-
-`reader.error`is the error (if failed).
76
+
Quando la lettura è completa, possiamo accedere al risultato come:
77
+
-`reader.result`il risultato (se la lettura è avvenuta con successo)
78
+
-`reader.error`l'errore (se la lettura è fallita).
79
79
80
-
The most widely used events are for sure `load`and`error`.
80
+
Gli eventi più utilizzati sono sicuramente `load`e`error`.
81
81
82
-
Here's an example of reading a file:
82
+
Qui vediamo un esempio di lettura di un file:
83
83
84
84
```html run
85
85
<inputtype="file"onchange="readFile(this)">
@@ -104,35 +104,35 @@ function readFile(input) {
104
104
</script>
105
105
```
106
106
107
-
```smart header="`FileReader`for blobs"
108
-
As mentioned in the chapter <info:blob>, `FileReader`can read not just files, but any blobs.
107
+
```smart header="`FileReader`per blobs"
108
+
Come accennato nel capitolo <info:blob>, `FileReader`può essere utilizzano non solo per la lettura di file, ma per qualsiasi blob.
109
109
110
-
We can use it to convert a blob to another format:
111
-
-`readAsArrayBuffer(blob)` -- to`ArrayBuffer`,
112
-
-`readAsText(blob, [encoding])` -- to string (an alternative to`TextDecoder`),
113
-
-`readAsDataURL(blob)` -- to base64 data url.
110
+
Possiamo utilizzarlo per convertire un `Blob` in un altro formato:
111
+
-`readAsArrayBuffer(blob)`, per convertirlo ad`ArrayBuffer`,
112
+
-`readAsText(blob, [encoding])`, per convertirlo a string (un'alternativa a`TextDecoder`),
113
+
-`readAsDataURL(blob)`, per convertirlo ad url in base64.
114
114
```
115
115
116
116
117
-
```smart header="`FileReaderSync` is available inside Web Workers"
118
-
For Web Workers, there also exists a synchronous variant of `FileReader`, called [FileReaderSync](https://www.w3.org/TR/FileAPI/#FileReaderSync).
117
+
```smart header="`FileReaderSync` è disponibile all'interno dei Web Workers"
118
+
Nel caso dei Web Workers, esiste anche una variante sincrona dell'oggetto `FileReader`, chiamata [FileReaderSync](https://www.w3.org/TR/FileAPI/#FileReaderSync).
119
119
120
-
Its reading methods `read*` do not generate events, but rather return a result, as regular functions do.
120
+
I suoi metodi di lettura `read*` non generano eventi, ma ritorna un risultato, come una qualsiasi funzione regolare.
121
121
122
-
That's only inside a Web Worker though, because delays in synchronous calls, that are possible while reading from files, in Web Workers are less important. They do not affect the page.
122
+
Questo è possibile solamente all'interno di un Web Worker, a causa dei ritardi dovuti alle chiamate sincrone che si possono verificare quando si legge da file, questi ritardi nei Web Workers sono meno importanti. In quanto non intaccano le performance della pagina.
123
123
```
124
124
125
-
## Summary
125
+
## Riepilogo
126
126
127
-
`File`objects inherit from`Blob`.
127
+
Gli oggetti di tipo `File`ereditano da`Blob`.
128
128
129
-
In addition to `Blob` methods and properties, `File`objects also have`name`and`lastModified` properties, plus the internal ability to read from filesystem. We usually get`File`objects from user input, like`<input>`or Drag'n'Drop events (`ondragend`).
129
+
In aggiunta ai metodi ed alle proprietà ereditate da `Blob`, gli oggetti `File`possiedono le proprietà`name`e`lastModified`, oltre alla capacità di leggere direttamente dal filesystem. Solitamente otteniamo oggetti`File`tramite input da utente, come`<input>`o eventi di Drag'n'Drop (`ondragend`).
130
130
131
-
`FileReader`objects can read from a file or a blob, in one of three formats:
132
-
-String (`readAsText`).
131
+
Gli oggetti `FileReader`possono leggere un `File` o un `Blob`, in uno dei seguenti formati:
132
+
-Stringa (`readAsText`).
133
133
-`ArrayBuffer` (`readAsArrayBuffer`).
134
-
- Data url, base-64 encoded (`readAsDataURL`).
134
+
- Data URL, codificati in base-64 (`readAsDataURL`).
135
135
136
-
In many cases though, we don't have to read the file contents. Just as we did with blobs, we can create a short url with `URL.createObjectURL(file)`and assign it to `<a>`or`<img>`. This way the file can be downloaded or shown up as an image, as a part of canvas etc.
136
+
In molti casi, però, non necessitiamo di leggere il contenuto di un file. Proprio come abbiamo fatto con i `Blob`, possiamo creare un URL con `URL.createObjectURL(file)`ed assegnarlo ad un tag `<a>`o`<img>`. In questo modo il file potrà essere scaricato o mostrato come immagine, come parte di un canvas etc.
137
137
138
-
And if we're going to send a `File`over a network, that's also easy: network API like `XMLHttpRequest`or`fetch`natively accepts `File` objects.
138
+
E nel caso in cui provassimo ad inviare un `File`sulla rete, sarà ancora più facile: le API di rete come `XMLHttpRequest`o`fetch`accettano nativamente oggetti di tipo `File`.
0 commit comments