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
+
Objek[File](https://www.w3.org/TR/FileAPI/#dfn-file)diwariskan dari `Blob`dan di-*extend* dengan kapabilitas terkait sistem file.
4
4
5
-
There are two ways to obtain it.
5
+
Ada dua cara untuk menggunakannya.
6
6
7
-
First, there's a constructor, similar to`Blob`:
7
+
Pertama, menggunakan konstruktor, mirip dengan`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`** -- adalah larik (array) dengan *value*Blob/BufferSource/String.
14
+
-**`fileName`** -- string nama file.
15
+
-**`options`** -- objek opsional:
16
+
-**`lastModified`** -- *timestamp* (tanggal *integer*) dari modifikasi terakhir.
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
+
Kedua, lebih sering kita mendapatkan file dari`<input type="file">`atau *drag'n'drop* atau antarmuka peramban lainnya. Dalam hal ini, file mendapatkan informasi ini dari OS.
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
+
Karena`File`diwariskan dari`Blob`, objek `File`memiliki properti yang sama, dengan tambahan:
That's how we can get a `File`object from`<input type="file">`:
24
+
Beginilah cara kita mendapatkan objek `File`dari`<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
+
Input memungkinkan untuk memilih beberapa file, jadi `input.files` adalah sebuah objek yang seperti array. Di sini kita hanya memiliki satu file, jadi kita hanya mengambil `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)adalah objek dengan tujuan tunggal untuk membaca data dari objek `Blob` (dan karenanya`File`juga).
46
46
47
-
It delivers the data using events, as reading from disk may take time.
47
+
FileReader mengirimkan data menggunakan *event*, karena membaca dari *disk* mungkin memakan waktu.
48
48
49
-
The constructor:
49
+
Konstruktor:
50
50
51
51
```js
52
-
let reader =newFileReader(); //no arguments
52
+
let reader =newFileReader(); //tanpa argumen
53
53
```
54
54
55
-
The main methods:
55
+
*Method* utama:
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)`** -- membaca data dalam format*binary*`ArrayBuffer`.
58
+
-**`readAsText(blob, [encoding])`** -- membaca data sebagai string teks dengan *encoding* yang diberikan (`utf-8`secara default).
59
+
-**`readAsDataURL(blob)`** -- membaca data *binary* dan menyandikannya sebagai url data base64.
60
+
-**`abort()`** -- membatalkan operasi.
61
61
62
-
The choice of `read*`method depends on which format we prefer, how we're going to use the data.
62
+
Pilihan *method*`read*`bergantung pada format yang kita inginkan, bagaimana kita akan menggunakan datanya.
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` -- untuk file *binary*, untuk melakukan operasi *binary* tingkat rendah. Untuk operasi tingkat tinggi, seperti *slicing*, `File`mewarisi dari`Blob`, sehingga kita dapat memanggilnya secara langsung, tanpa membacanya.
65
+
-`readAsText` -- untuk file teks, ketika kita ingin mendapatkan string.
66
+
-`readAsDataURL` -- ketika kita ingin menggunakan data ini di `src`untuk`img`atau tag lainnya. Ada alternatif untuk membaca file untuk itu, seperti yang dibahas dalam bab<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
+
Saat pembacaan file berlangsung, ada *event*:
69
+
-`loadstart` -- pemuatan dimulai.
70
+
-`progress` -- terjadi selama membaca file.
71
+
-`load` -- tidak ada kesalahan, membaca file selesai.
72
+
-`abort` -- `abort()`dipanggil.
73
+
-`error` -- terjadi kesalahan.
74
+
-`loadend` -- membaca file selesai, baik sukses ataupun gagal.
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
+
Ketika pembacaan file selesai, kita dapat mengakses hasilnya sebagai:
77
+
-`reader.result`adalah hasilnya (jika berhasil)
78
+
-`reader.error`adalah kesalahan (jika gagal).
79
79
80
-
The most widely used events are for sure `load`and`error`.
80
+
Peristiwa yang pasti paling banyak digunakan adalah `load`dan`error`.
81
81
82
-
Here's an example of reading a file:
82
+
Berikut ini contoh membaca sebuah 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`untuk blobs"
108
+
Seperti disebutkan dalam bab <info:blob>, `FileReader`tidak hanya dapat membaca file, tetapi semua 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
+
Kita dapat menggunakannya untuk mengonversi blob ke dalam format yang lain:
111
+
-`readAsArrayBuffer(blob)` -- ke`ArrayBuffer`,
112
+
-`readAsText(blob, [encoding])` -- ke string (alternatif untuk`TextDecoder`),
113
+
-`readAsDataURL(blob)` -- ke url data 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` tersedia di dalam Web Workers"
118
+
Untuk Web Workers, ada juga sebuah varian synchronous dari `FileReader`, yang disebut [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
+
Method pembacaannya `read*` tidak menghasilkan event, melainkan mengembalikan hasil, seperti yang dilakukan fungsi biasa.
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
+
FileReaderSync hanya di dalam Web Worker, karena penundaan dalam panggilan synchronous, yang memungkinkan saat membaca dari file, di Web Worker kurang penting. Mereka tidak mempengaruhi halaman.
123
123
```
124
124
125
-
## Summary
125
+
## Ringkasan
126
126
127
-
`File`objects inherit from`Blob`.
127
+
Objek `File`diwariskan dari`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
+
Selain *method* dan properti seperti `Blob`, objek `File`juga memiliki properti`name`dan`lastModified`, ditambah kemampuan internal untuk membaca dari sistem file. Kita biasanya mendapatkan objek `File`dari input pengguna, seperti *event*`<input>`atau Drag'n'Drop (`ondragend`).
130
130
131
-
`FileReader`objects can read from a file or a blob, in one of three formats:
131
+
Objek `FileReader`dapat membaca dari file atau blob, dalam salah satu dari tiga format berikut:
132
132
- String (`readAsText`).
133
133
-`ArrayBuffer` (`readAsArrayBuffer`).
134
-
-Data url, base-64 encoded (`readAsDataURL`).
134
+
-Url data, di-*encode* ke 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
+
Namun, dalam banyak kasus, kita tidak perlu membaca konten file. Seperti yang kita lakukan dengan blob, kita dapat membuat url pendek dengan `URL.createObjectURL(file)`dan menetapkannya ke `<a>`atau`<img>`. Dengan cara ini file dapat diunduh atau ditampilkan sebagai gambar, sebagai bagian dari kanvas, dll.
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
+
Dan jika kita akan mengirim `File`melalui jaringan, itu juga mudah: API jaringan seperti `XMLHttpRequest`atau`fetch`secara *native* menerima objek `File`.
0 commit comments