基本的な技術の概要
約束する：
A ES6の導入非同期プログラミング・ソリューションを提供することを約束オブジェクトを介して、統一された非同期状態管理方法を
プロミスオブジェクトを使用した場合、図2に示すように、一般的には、最初にする必要がインスタンス化
図3に示すように、オブジェクトがインスタンス化されるプロミス非同期状態管理コンテナ、解決（）および（）拒否するために使用される約束の状態を制御する方法を
図4に示すように、解決するための呼び出し（）および（）メソッドができ拒否任意の値を渡すリスニング状態として、この値が変更されたパラメータは、コールバック関数を介して広がります
図5は、プロミスは.then（onFulfilled、onRejected）及び.catch（onRejected）などの提供しました
以下のためのプロトタイプチェーンアプローチ登録状態変更をトリガーするコールバック関数
聞かせて約束は= 新しい約束（（解決、拒否）=> { 場合（/ * 操作成功* / ）{ 解決（値） } 他{ 拒否（エラー） } }）
プロミスステータス：
。1、「保留」：初期状態では、非同期プロセスの代表はまだ進行中で、成功か失敗かが決定されていないです
2は、「成就」：正常な動作を解決（）メソッドを呼び出すことによって、国家の約束によって『保留する』 『成就』に変更されます
。3、「拒否」：拒否（）メソッドを呼び出すことで、失敗した操作は、ステータスが約束に変わります『拒否しました』
信頼性の約束：
1、統一フォーマット：非同期プロセス約束パッケージが統一された状態変化モード、統一かつ均一なAPIコールバック形式を持っています
図2に示すように、外部の影響に対する状態：状態プロミス解決（の制御方法のみ）及び（拒否）、この状態は直接外部アクセスすることができません、
これは、外部から状態を変更するためにどのような方法を提供していません
3、確実に状態：成功の実装のための初期状態（保留）からの変化（成就）または失敗（拒否）、
その後、状態が完全にダウンして決定される、任意の後続の操作によって影響されることはありません
図4は、コールバック関数は、ワンタイムである：アップトリガーに一旦、制御不能の数を実行するために、コールバック関数のうち、非同期プログラミングコールバック関数に基づいて、過去の問題を回避するため
5、コールバック早すぎる質問はありません：変化状態が待機するときの変化がトリガされる前に、コールバック関数が状態で登録されている場合は、登録ステータスが決定されたとき、
あなたはすぐにこの関数を呼び出すと、対応する戻り値を渡す約束
図6は、コールバック関数との間の相互に影響を与えない：相互に登録されたコールバック関数とプロミスの単離を、
したがって、個々のコールバックの実行エラーは、他のコールバック関数の正常な実行に影響を与えません。
図7に示すように、コールバック関数の実装のタイミングが決定されます
シリアル実行とチェーン呼び出しを約束します：
1、約束。prototype.then：
（1）.then（onFulfilled、onRejected） のプロトタイプチェーンプロミス方法であって、登録オブジェクトの状態がプロミス変化したときにコールバックを
（2）また、パラメータように、2つのコールバック関数をとる onRejectedをデフォルトとすることができる約束を変更トリガが異なる状態にあるとき、それぞれ、
（3）.then（）メソッドを作成して返す新しいプロミスは、オブジェクト、（P2とP1を参照することを約束リスニングと現在のオブジェクトを参照します）
コールバック関数の実装を特徴付けるために使用され、プロセスを満たし、次のルール：
、P1の状態は、コールバックとコールバックの種類を実行を実行する際に決定し、状態P2には影響を与えません。
B、p2の初期状態では、コールバック関数が成功ステータスが「成就」に変更されて実行されたとき、「保留中」です
例外は、コールバックの実行中にスローされた場合「拒否」に変更されました
C、それを渡すときにパラメータP2トリガ状態の値として、コールバック関数の戻り値は、解決（値）を変更します
2、約束のチェーンコール：
（1）は、非常に直感的な必要性は複数のトップダウンプロセスが非同期シーケンシャルによって実行される線形結合、方法
難易度をコーディング削減するだけでなく、コードの可読性を高めながら、
（2）同一のコールバックオブジェクトプロミス互いの登録に基づいて、互いに妨害することなく特性を、我々は必要な限りにおいて鎖分岐することができ
3、Promise 并行执行与管理：
(1)基于 Promise 的异步任务串行执行，本质上是通过 .then()方法去控制上一个异步任务
完成之后再触发下一个异步任务的执行
(2)只需要同步地创建这些异步任务，并对它们的 Promise 对象进行相应的管理即可改造成并行执行
function getX() { return new Promise(resolve => { setTimeout(() => { resolve(1) }, 3000) }) } function getY() { return new Promise(resolve => { setTimeout(() => { resolve(10) }, 5000) }) } function getXAndY([promiseX, promiseY]) { let results = [] return promiseX .then(x => { results.push(x) return promiseY }) .then(y => { results.push(y) return results }) } getXAndY([ getX(), getY() ]) .then(results => { // 5s 后输出 11 console.log(results[0] + results[1]) })
(3)Promise 已经提供了 Promise.all() 方法来实现与上述 getXAndY 一样的功能（一种并行状态管理的方案）
(4)Promise.race() 方法，用于获取第一个发生状态变更的 Promise 对象
Fetch API：
1、Fetch API 首先提供了网络请求相关的方法 fetch()，其次还提供了用于描述资源请求的 Request 类，以及描述
资源响应的 Response 对象，这样就能够以一种统一的形式将资源的请求与响应过程应用到更多的场景当中
2、fetch() 需要传入一个 Request 对象作为参数，它会根据 Request 对象所描述的请求信息发起网络请求
3、fetch() 还支持传入请求 URL 和请求配置项的方式，它会自动根据这些参数实例化 Request 对象之后再去发起请求
fetch(new Request('/path/to/resource', {method: 'GET'})) // 等价于 fetch('/path/to/resource', {method: 'GET'})
4、fetch() 会返回 Promise 对象，当请求响应时 Promise 执行 resolve 并传回 Response 对象
5、fetch() 只有在网络错误或者是请求中断的时候才会抛出异常，此时 Promise 对象会执行 reject 并返回错误信息，
而服务端返回的 HTTP 404、500 等状态码并不认为是网络错误，需要检查 Response.status、Response.ok
等属性以确保请求成功响应
fetch('/path/to/resource').then(response => {
if (response.status === 200) {
// 请求成功
} else {
// 请求失败
}
})
.catch(err => {
// 网络请求失败或请求被中断
})
Request：
1、Request 是一个用于描述资源请求的类，通过 Request() 构造函数可以实例化一个 Request 对象
2、语法格式：let request = new Request(input, init)
注：input 代表想要请求的资源，可以是资源的 URL，或者是描述资源请求的 Reqeust 对象；
init 为可选参数，可以用来定义请求中的其他选项
3、发送请求：
(1)GET 请求，请求参数需要写到 URL 当中
(2)POST 请求，请求参数需要写到 body 当中
(3)自定义请求的 Headers 信息
(4)设置发起资源请求时带上 cookie
// GET 请求 let getRequest = new Request('requestUrl?name=lilei', { method: 'GET' }) // POST 请求 let postRequest = new Request('requestUrl', { method: 'POST', // body 可以是 Blob、FormData、字符串等等 body: JSON.stringify({ name: 'lilei' }) }) // 自定义请求的 Headers 信息 let customRequest = new Request('requestUrl', { // 这里展示请求 Content-Type 为 text/plain 的资源 headers: new Headers({ 'Content-Type': 'text/plain' }) })
4、常见属性：
(1)url：String 类型，只读，请求的 url
(2)method：String 类型，只读，请求的方法，如 'GET'，'POST' 等
(3)headers：Headers 类型，只读，请求的头部，可通过 get() 方法获取 'Content-Type'，'User-Agent' 等信息
//设置发起资源请求时带上 cookie let cookieRequest = new Request('requestUrl', { credentials: 'include' }) if (request.url === 'https://example.com/data.txt') { // ... } if (request.method === 'POST') { // ... } if (reuqest.headers.get('Content-Type') === 'text/html') { // ... }
Response:
1、Response 类用于描述请求响应数据，通过 Response() 构造函数可以实例化一个 Response 对象
2、语法格式：let response = new Response(body, init)
注：body 参数代表请求响应的资源内容，可以是字符串、FormData、Blob 等等；
init 为可选参数对象，可用来设置响应的 status、statusText、headers 等内容
3、在实际应用当中，我们一般会通过 fetch()、Cache API 等等获得请求响应对象，然后再对响应对象进行操作
4、Response 对象的相关属性：
(1)status：Number 类型，包含了 Response 的状态码信息，开发者可以直接通过 status 属性进行状态码检查，
从而排除服务端返回的错误响应
(2)statusText：String 类型，包含了与状态码一致的状态信息，一般用于解释状态码的具体含义
(3)ok：Boolean 类型，只有当状态码在 200-299 的范围时，ok 的值为 true
5、读取响应体：
(1)text()：解析为字符串
(2)json()：解析为 JSON 对象
(3)blob()：解析为 Blob 对象
(4)formData()：解析为 FormData 对象
(5)arrayBuffer()：解析为 ArrayBuffer 对象
6、Response 提供了 clone() 方法来实现对 Response 对象的拷贝
Fetch API 与 XHR 对比：
1、Fetch API 的异步机制更为先进
2、Fetch API 更为简洁
3、Fetch API 的应用范围更广
Cache API：
1、兼容性检测：在主线程或者 Worker 线程中通过判断全局变量 caches 是否存在来检测浏览器是否支持 Cache API
if ('caches' in self) { console.log('当前环境支持 Cache API') }
2、打开 Cache 对象：通过 caches.open() 方法可以打开一个 Cache 对象，cacheName 表示要打开的 Cache 对象的名称。
该方法是异步方法，返回的 Promise 对象在 resolve 时会返回成功打开的 Cache 对象
caches.open(cacheName).then(cache => {/* 获得 Cache 对象 */})
3、添加缓存：Cache 对象提供了 put()、add()、addAll() 三个方法来添加或者覆盖资源请求响应的缓存
这些添加缓存的方法只会对 GET 请求起作用
4、查找缓存：cache.match() 和 cache.matchAll() 可以实现对缓存的查找
5、获取匹配的请求：通过 cache.keys() 方法实现
6、删除缓存：通过 cache.delete() 方法可以实现对缓存的清理