jQuery中deferred、promise對象的使用

// 順序執行多個異步操作
// deferred.then() 中返回一個新建的 deferred 對象
$.Deferred(function(d){
	console.log('start');
	d.resolve();
}).then(function(){
	var dfd = $.Deferred();
	
	setTimeout(function(){
		console.log('done1');;
		dfd.resolve();
	},1000);
	
	return dfd;
}).then(function(){
	var dfd = $.Deferred();
	
	setTimeout(function(){
		console.log('done2');;
		dfd.resolve();
	},1000);
	
	return dfd;
}).done(function(){
	console.log('finish');
});

// 傳遞異步操作的返回值
$.Deferred(function(d){
	d.resolve([]);
}).then(function(arr){
	arr.push(1);
	console.log(arr);
	return arr;
}).then(function(arr){
	arr.push(2);
	console.log(arr);
	return arr;
}).then(function(arr){
	arr.push(3);
	console.log(arr);
	return arr;
}).done(function(arr){
	console.log(arr);
});
/*
[1]
[1, 2]
[1, 2, 3]
[1, 2, 3]
*/

// 監聽多個異步操作完成後再執行目標操作
$.when(function(){
	var dfd = $.Deferred();
	
	setTimeout(function(){
		console.log(1);
		dfd.resolve();
	}, 1000);
	
	return dfd;
}(), function(){
	var dfd = $.Deferred();
	
	setTimeout(function(){
		console.log(2);
		dfd.resolve();
	}, 2000);
	
	return dfd;
}()).then(function(){
	console.log('done');
},function(){
	console.log('fail');
});