Webページの相互作用はますます複雑になりつつあり、JavaScriptはますます非同期操作になりつつあります。たとえば、一般的なAJAX要求には、リクエストが完了したときに操作に応答する必要があります。リクエストは通常非同期です。リクエストプロセス中、ユーザーはページをブロックせずに他の操作を実行できます。この非同期相互作用効果は、ユーザーにとって非常に友好的です。しかし、開発者にとっては、この種の操作に大量に対処することは非常に友好的です。非同期リクエストによって完了した操作は、コールバック関数で事前に定義する必要があり、この関数はリクエストが完了した後に呼び出される必要があります。この非線形の非同期プログラミング方法は、開発者を不快にし、多くの不便さをもたらし、コードの結合と複雑さを高め、コードの編成は非常に不可能であり、コードの維持可能性を大幅に減らします。状況はより複雑です。操作が実行される前に複数の非同期AJAX要求が完了するまで待つ必要がある場合、コールバック関数はネストされます。いくつかのレイヤーをネストする必要がある場合、祝福を求めることしかできません。
次の一般的な非同期関数を見てみましょう。
コードコピーは次のとおりです。
var showmsg = function(){
setimeout(function(){
アラート( 'hello');
}、5000);
};
これは通常、関数にコールバックを追加する場合に行われます。
コードコピーは次のとおりです。
var showmsg = function(callback){
setimeout(function(){
アラート( 'hello');
//ここにコールバックを追加します
折り返し電話();
}、5000);
};
Easy.js Promiseを使用する場合、元の関数をPromiseインスタンスにカプセル化する必要がある限り、コールバックを追加する方法ははるかにエレガントになります。
コードコピーは次のとおりです。
var showmsg = function(){
// Promiseインスタンスを構築します
var promise = new e.promise();
setimeout(function(){
アラート( 'hello');
//約束の状態を変更します
promise.resolve( 'done');
}、5000);
// Promiseインスタンスに戻ります
約束を返す;
};
通常の関数を約束のインスタンスにカプセル化するための3つの重要な手順があります。最初のステップは、関数内に約束のインスタンスを構築することです。 2番目のステップは、展開機能が実行された後に完了する約束の状態を変更することです。 3番目のステップは、この約束のインスタンスを返すことです。各Promiseインスタンスには3つの状態があります。つまり、保留中(完了していない)、解決(完了、成功)、拒否(拒否、失敗)です。コールバックを追加する方法を見てみましょう。
コードコピーは次のとおりです。
showmsg()。then(function(str){
//ここにコールバックが追加されます
コールバック(str);
});
これは、コールバック関数を元の非同期関数から完全に分離し、コード組織の観点からははるかにエレガントです。 Resolveは、Then Methodを使用して追加されたコールバックにデータを簡単に転送できるパラメーターを受け入れます。
Ajaxリクエストの場合、Easy.jsはAjaxメソッドをPromiseオブジェクトに直接カプセル化し、Call BackにThenメソッドを直接追加できます。
コードコピーは次のとおりです。
e.ajax({
URL: 'test1.php'、
タイプ:「get」
})
.then(function(){
//リクエストを成功させてコールバックを追加します
}、 関数(){
//リクエストに失敗したコールバックを追加します
});
次のメソッドは、パラメーターとして2つの関数を受け入れます。最初の関数は完了したコールバックで、2番目の関数は失敗したコールバックです。
上記の複数のAJAXリクエストがある場合はどうなりますか?次に、When Methodを使用する必要があります。この方法では、複数の約束インスタンスをパラメーターとして受け入れることができます。
コードコピーは次のとおりです。
var requests = e.when(e.ajax({{
URL: 'test1.php'、
タイプ:「get」
})、e.ajax({
URL: 'test2.php'、
タイプ:「get」
}));
requests.then(function(arg1、arg2){
console.log( 'success:' + arg1 [0] + arg2 [0]);
}、function(arg1、arg2){
console.log( '障害:' + arg1 + arg2);
});
方法は、複数の約束インスタンスを配列に保存し、完了したコールバックを実行する前に配列のすべての約束インスタンスが完了するまで待ちます。インスタンスが拒否されると、拒否されたコールバックがすぐに実行されます。
約束パターンは、CommonJSの仕様の1つです。多くの主流のJavaScriptライブラリには、これらの機能を実装するために延期されたJQueryやDojoなど、対応する実装があります。ここで私はまだjQueryの延期について不平を言いたいです。内部使用は別として、これはユーザーの使用率が最も低いモジュールである必要があります。これは、より複雑な使用方法と特定の関係を持っています。