コールバック地獄だけでなく、彼らの救世主の約束

Ajaxと非同期データを取得することができるようにするために、非同期の膨大な数の内部JSONPフロント、将来的に非同期実行の成功後にデータを取得するために、多くのコールバックを使用します。リクエストはずっと、幸いでない場合は、いったんアップグレードのある程度までの要求の数、および以降の複雑さは、いくつかの問題が発生します。
例えば：私たちは3つの結果を得るために同じ時間を必要とし、3つの非同期要求を開いているので、どのように我々はそれに対処すべきか？
私は、Ajaxの例で最初にするために使用：
我々は、フロント欲求によって異なるデータで3つのPHPファイルを取得します

d1.phpの

d2.php

d3.php

我々は、コールバック地獄を取得するための方法を使用しました

	<script type="text/javascript"src="../ajax.js"></script>
	<script type="text/javascript">
		var p1 = "http://localhost/webRoot/promise/data/d1.php";
		var p2 = "http://localhost/webRoot/promise/data/d2.php";
		var p3 = "http://localhost/webRoot/promise/data/d3.php";
		ajax({
			url:p1,
			success:function(res){
				console.log(res);
				ajax({
					url:p2,
					success:function(res2){
						console.log(res2);
						ajax({
							url:p3,
							success:function(res3){
								console.log(res3);
								console.log(res,res2,res3);
							}
						})
					}
				})
			}
		})

私たちは、その効果を満たすために、これを書いている。

しかし、非同期的に最も内側の端を実行しない場合、我々はすべてのプログラムのうち、不利益を見ることができ、すべての小さな再帰的な影がかかり、性能は終わりに等価ではありません。また、フォーマットが間違ったチューニングが非常に、非常に貧しいセマンティック、エレガントな不便ではありません。
言い換えれば、私たちがすることができますが、コールバック地獄の方法により、当社のニーズを満たすために、しかし、欠点は、まだ明らかです。その後、我々はそこにあなたを得るためのより良い方法を持っています！それは約束です！
Jsの新しいバージョンが表示される前に、我々は、コールバック地獄を通じて問題を解決するためにしているが、開始ES6から、これは、私たちは新しい構文で「かわいい」の新しい追加しました。私はこの小さなかわいいについてあなたに紹介しましょう。

プロミス
約束は（約束は、非同期）
約束のオブジェクトは、非同期操作を表し、それが満たされ、（進行中の）保留中の、3つの状態に分けることができます（成功）と拒否された（失敗しました）。非同期操作の結果のみが、あなたはどのような現在の状態を決定することができ、他の操作は、その状態を変更することはできません。
文法

//Promise是一个构造函数
//new的同时立即传参，参数是回调函数，回调函数身上可以接受两个参数，分别是：resolve(success,成功)，reject(error,失败)

            var p = new Promise(function(a,b){
                // 正在执行....
                // 此处放置异步的程序

                // a就是在then中的第一个回调函数，表示成功要做的事情
                // b就是在catch中的第一个回调函数，表示失败要做的事情
            });
            p.then(function(){
                // 成功的预置函数
            });
            p.catch(function(){
                // 失败的预置函数
            });

その後、我々は約束それの始まりで問題を解決するために行う必要がありますか？

<script type="text/javascript"src="../ajax.js"></script>
	<script type="text/javascript">
		var op1 = "http://localhost/webRoot/promise/data/d1.php";
		var op2 = "http://localhost/webRoot/promise/data/d2.php";
		var op3 = "http://localhost/webRoot/promise/data/d3.php"; 
//      预置函数
        var p1 = new Promise(function(resolve){
        	ajax({
                url:op1,
                success:function(res1){
                    resolve(res1);
                }
            })
        })
        var p2 = new Promise(function(resolve){
        	ajax({
                url:op2,
                success:function(res2){
                    resolve(res2);
                }
            })
        })
        var p3 = new Promise(function(resolve){
        	ajax({
                url:op3,
                success:function(res3){
                    resolve(res3);
                }
            })
        })
      //执行输出  
        p1.then(function(r1){
        	console.log(r1);
        	return p2;
        }).then(function(r2){
        	console.log(r2);
        	return p3;
        }).then(function(r3){
        	console.log(r3);
        })

レンダリング：

もちろん我々は非常に我々がデータを取得したいの約束を通じてクリアし、それは非常に簡単に理解していないとそれを見るよりも、やり方以前にコールバック地獄されています。