Promiseといえば、.then()
がPromiseのもっとも重要なメソッドで、まさにkawtyさんが求めているものです。
.then()
メソッドは関数を受け取り、その関数が返す値を代表するPromiseを返します。例えば、
var d = $.Deferred();
d.promise().then(function (v) {
snippet.log(v); // 9
return v * 2;
}).then(function (v2) {
snippet.log(v2); // 18
return v2 + 7;
}).then(function (v3) {
snippet.log(v3); // 25
});
d.resolve(9);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<!-- Provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 -->
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>
それだけではなくて、例え.then()
へ渡す関数から別のPromiseを返しても、そのPromiseの中の値がちゃんと次の.then()
に渡されます
var d = $.Deferred();
d.promise().then(function (v) {
snippet.log(v);
return v * 2;
}).then(function (v2) {
snippet.log(v2);
var d2 = $.Deferred();
d2.resolve(v2 + 7);
return d2.promise();
}).then(function (v3) {
snippet.log(v3);
});
d.resolve(9);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<!-- Provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 -->
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>
ちなみに、このようなコードを書く必要はありません。
$.ajax(...)
.then(function(originalResult) {
return someTransform(originalResult);
}).done(function(result) {
// result には someTransform(originalResult) が渡される。
});
.then()
に渡されている匿名関数はただoriginalResult
をそのままsomeTransform()
に渡しているので、この場合はsomeTransform
を直接.then()
に渡すことができるし、この方が読みやすいと思われることが多いです。
$.ajax(...)
.then(someTransform)
.done(function(result) {
// result には someTransform(originalResult) が渡される。
});
そして最後に、jQueryのPromiseにはいくつかの問題点があり、あまり使わない方がいいという人が多いです。jqXHRを扱っている場合、早く別のPromiseライブラリ又はJS6の.when()
メソッドに渡して、ちゃんとしたPromiseに変換した方がいいです。