JavaScript（JS）学习笔记 6 常用的JS内置对象（FileReader对象 FormData对象 Promise对象 Response对象）

基本作用：对象允许Web应用程序异步读取存储在用户计算机上的文件（或原始数据缓冲区）的内容，使用 File 或 Blob 对象指定要读取的文件或数据。

创建语法：

javascript">var reader = new FileReader()

常用事件（新方式下的）：这些事件会分别在读取过程中的某个阶段触发：

常用方法：

readAsArrayBuffer(blob): 读取指定的 Blob 或 File 对象，并在读取完成后以 ArrayBuffer 对象的形式存储结果，表示原始二进制数据。
readAsDataURL(blob): 读取指定的 Blob 或 File 对象，并在读取完成后以数据URL（Base64编码）的形式存储结果。
readAsText(blob, encoding): 读取指定的 Blob 或 File 对象，并在读取完成后以文本形式存储结果。encoding 参数指定文本的编码类型，默认为 “utf-8”。

获取读取结果：可以通过 FileReader 对象的 result 属性获取读取的结果。

基本概述：在HTML5中引入的一个JS内置对象，主要用于通过一组键值对的方式表示表单字段和其对应的值。该对象可以模拟HTML中表单提交的行为，向服务器发送一组表单数据，而不需要真正在HTML界面中创建一个表单。

创建语法：有两种常用的创建方式：

向表单中添加数据：

javascript">FormData对象名.append('数据的键', ‘数据的值’)

判定表单中是否存在某个键：

javascript">FormData对象名.has(键名)

读取表单中的数据：由于表单数据主要是装配后用来发送，因此读取操作使用情况很少。

删除表单中的数据：

FormData对象名.delete(键名)

向服务器发送表单数据：

基本作用：用于表示异步操作最终完成或失败的一个对象，提供了一种更为优雅的方式来处理异步操作的结果，也就是可以将异步操作以同步操作的流程表达出来，避免了层层嵌套的回调函数，提高了代码的可读性和可维护性

对象状态：一个Promise对象有以下三种状态。对象状态只能由待定变为已兑现或已拒绝，并且状态一旦改变，就不会再变。

创建语法：可以通过 new Promise() 构造函数来创建一个新的Promise对象。构造函数接收一个执行器函数（executor function），该函数接收两个参数：resolve 和 reject（可选）。

使用方式：该对象的一种典型使用语法如下所示：

javascript">Promise.then(function(result) {// 处理成功结果
}).catch(function(error) {// 处理错误
}).finally(function() {// 总是执行
});

.then() 方法用于注册当 Promise 成功时的回调函数。
.catch() 方法用于注册失败时的回调函数。尽管在 .then() 方法中可以修改 reject 参数来设置 Promise 被拒绝时的回调函数，但是更推荐使用 .catch 方法来进行处理，因为其语义更加清晰。
.finally() 方法用于无论成功或失败都会执行的回调函数。

链式调用：这是 Promise 最强大的特性之一，允许将多个异步操作串联起来，使代码更加清晰和易于维护。

基本概念：链式调用在一个 Promise 完成后，直接返回另一个 Promise，从而形成一个操作链。每个 .then() 方法都可以返回一个新的 Promise ，这样就可以继续调用下一个 .then()。
执行逻辑：在链式调用中，每个 .then() 方法都可以接收到前一个 .then() 返回的值。如果 .then() 没有返回值，则默认返回 undefined。如果返回一个普通值（非Promise），这个值会被传递给下一个 .then() 。
错误处理：在链式调用中，如果任何一个 Promise 被拒绝，错误会被传递到最近的 .catch() 方法。如果没有 .catch() ，错误将会被抛出。
中断方式：可以在 .then() 或 .catch() 中返回一个处于 Pending 状态的 Promise。这样，后续的 .then() 或 .catch() 将不会被执行。

箭头函数：在 Promise 对象中常以箭头函数作为该函数的参数。下面对箭头函数进行介绍：

基本概念：是 ECMAScript 2015 中引入的一种编写函数表达式的新语法，提供了一种更简洁的方式来书写函数。
使用语法：(param1, param2...) => {...函数体...}
- 如果传入的参数只有一个，则可以省略括号，表示为：param => {函数体}。
- 如果函数体中只有一个表达式，则可以省略花括号，语法为：(param1, param2...) => expression。并且，该表达式的值就会作为函数的返回值。