Ada objek file dalam JavaScript; objek file mewakili file dan digunakan untuk membaca dan menulis informasi file. Objek ini mewarisi objek Blob dan memperluas fungsi yang terkait dengan sistem file objek Blob dapat digunakan; dapat menggunakan konstruktor "File baru (fileParts, fileName, [options])" untuk mendapatkan objek file.
Lingkungan pengoperasian tutorial ini: sistem Windows 10, JavaScript versi 1.8.5, komputer Dell G3.
Objek berkas
Objek File mewakili file dan digunakan untuk membaca dan menulis informasi file. Itu mewarisi objek Blob, atau merupakan objek Blob khusus, yang dapat digunakan dalam semua situasi di mana objek Blob dapat digunakan.
Kasus penggunaan yang paling umum adalah kontrol unggah file () dari formulir. Setelah pengguna memilih file, browser akan menghasilkan array yang berisi setiap file yang dipilih oleh pengguna.
// Kode HTML adalah sebagai berikut // <input id="fileItem" type="file">var file = document.getElementById('fileItem').files[0];file instanceof File // truePada kode di atas, file adalah file pertama yang dipilih oleh pengguna, yang merupakan turunan dari File.
Konstruktor
Browser secara asli menyediakan konstruktor File() untuk menghasilkan objek instance File.
File baru (array, nama [, opsi])
Konstruktor File() menerima tiga parameter.
Array: Array yang anggotanya dapat berupa objek atau string biner, yang mewakili konten file.
nama: String, mewakili nama file atau jalur file.
pilihan: Objek konfigurasi, atur atribut instance. Parameter ini opsional.
Parameter ketiga mengkonfigurasi objek dan dapat mengatur dua properti.
type: String, menunjukkan tipe MIME dari objek instance. Nilai defaultnya adalah string kosong.
lastModified: Stempel waktu, menunjukkan waktu modifikasi terakhir, defaultnya adalah Date.now().
Di bawah ini adalah contohnya.
var file = File baru(['foo'], 'foo.txt', { ketik: 'teks/polos', });Properti instans dan metode instan
Objek file memiliki properti instance berikut.
File.lastModified: waktu modifikasi terakhir
File.name: nama file atau jalur file
File.size: ukuran file (satuan byte)
File.type: Jenis file MIME
var myFile = File baru([], 'file.bin', { lastModified: new Date(2018, 1, 1),});myFile.lastModified // 1517414400000myFile.name // "file.bin"myFile.size / / 0filesaya.type // ""Dalam kode di atas, karena konten myFile kosong dan tipe MIME tidak disetel, atribut size sama dengan 0 dan atribut type sama dengan string kosong.
Objek File tidak memiliki metode instansnya sendiri. Karena objek tersebut mewarisi objek Blob, Anda dapat menggunakan metode instans Blob, irisan().
Perluas pengetahuan Anda:
Ada dua cara untuk mendapatkannya.
File baru (bagian file, Nama file, [pilihan])
fileParts - Array nilai tipe Blob/BufferSource/String.
nama file - string nama file.
opsi - objek opsional:
lastModified - Stempel waktu modifikasi terakhir (tanggal bilangan bulat).Lebih umum lagi, kita mendapatkan file dari <input type="file"> atau drag and drop atau antarmuka browser lainnya. Dalam hal ini, file akan mendapatkan informasi ini dari sistem operasi (OS).
Karena File mewarisi dari Blob, objek File memiliki properti yang sama, ditambah:
name - nama file, lastModified - stempel waktu modifikasi terakhir.Beginilah cara kita mendapatkan objek File dari <input type="file">:
<input type="file" onchange="showFile(this)"><skrip>fungsi showFile(input) { let file = input.files[0]; // Misalnya peringatan my.png(`Terakhir diubah: ${file.lastModified}`); // Misalnya 1552830408824}</script>Detail: Harap diperhatikan:
Input dapat memilih banyak file, jadi input.files adalah objek seperti array. Disini kita hanya mempunyai satu file, jadi kita ambil saja input.files[0].