列出 FileReader 对象所有方法，及其用法

> FileReader 对象是 HTML5 中的一个内置对象，用于读取文件内容。以下是 FileReader 对象的所有方法及其用法：

#### 1. `readAsBinaryString(file)`
以二进制字符串形式读取文件内容，返回值类型为 String。

用法示例：

```js
var file = document.getElementById("fileInput").files[0];
var reader = new FileReader();

reader.onload = function() {
  var content = reader.result;
  console.log(content);
};
reader.readAsBinaryString(file);
```

#### 2. `readAsText(file[, encoding])`

以文本形式读取文件内容，返回值类型为 `String`。
可以指定 `encoding` 参数来指定文件的编码方式，默认为 UTF-8 编码。
用法示例：

````js
var file = document.getElementById("fileInput").files[0];
var reader = new FileReader();

reader.onload = function() {
  var content = reader.result;
  console.log(content);
};
reader.readAsText(file, "GBK");
````

#### 3. `readAsArrayBuffer(file)`

以二进制数组形式读取文件内容，返回值类型为 `ArrayBuffer`。

用法示例：

````js
var file = document.getElementById("fileInput").files[0];
var reader = new FileReader();

reader.onload = function() {
  var content = reader.result;
  console.log(content);
};
reader.readAsArrayBuffer(file);
````

#### 4. `readAsDataURL(file)`

以 Data URL 形式读取文件内容，返回值类型为 `String`。

用法示例：

````
var file = document.getElementById("fileInput").files[0];
var reader = new FileReader();

reader.onload = function() {
  var content = reader.result;
  console.log(content);
};
reader.readAsDataURL(file);
````

> 需要注意的是，在使用 `FileReader` 对象读取文件时，需要先获取文件选择框中选择的文件，然后创建一个 `FileReader` 对象，并使用其中的方法读取文件内容。当文件读取完成时，`onload` 事件被触发，可以通过 `result` 属性获取文件的内容。在使用 `readAsText()` 方法读取文件内容时，需要注意文件的编码方式，默认情况下，`readAsText()` 方法使用 UTF-8 编码读取文件内容，可以通过第二个参数指定其他编码方式，例如 `reader.readAsText(file, 'GBK')`。

相关推荐

近期文章