TOP ▲
itcore TOP プログラムパーツ
deferred 同期逐次処理（JavaScript） | itcore 2018年
JavaScript
JavaScript TOP
プログラム
<div id=div1></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
// 逐次処理 前の非同期処理が終わってから次の処置を行う。
f1(1)
.then(f1)
.then(f1)
.then(f2);
function f1(no) {
var d = new $.Deferred;
$('#div1').append('A' + no + '<br>');
// 実用的にはここにajax等の処理を入れる。
setTimeout(function(){
d.resolve(no + 1);
}, 1000);
return d.promise();
}
// forループによる同期逐次処理
function f2(no) {
var promise = $.Deferred().resolve().promise();
for (var i = no; i < no + 5; i++) {
promise = promise.then((function(i) { return function() {
$('#div1').append('B' + i + '<br>');
var d = $.Deferred();
setTimeout(function(){
d.resolve();
}, 1000);
return d.promise();
};})(i));
}
}
</script>
実行結果