直线形业务队列

 

function onReady (func) {
		if (document.readyState === 'complete') {
		　　setTimeout(function () {
			func();
		　　}, 0);
		　　return;
		}
		window.addEventListener('load', runCallback, false);
　　　　　　	function runCallback () {
		　　window.removeEventListener('load', runCallback);
		　　setTimeout(function () {
			func();
		　　}, 0);
	}
}

　　

此处是这样一个业务逻辑

1. 加入一个回调A
2. 如果这个回调还未执行完，又加入了一个回调B，则把B推入队列中，当A执行完后，再执行B
3. 如果回调A在执行完后，又加入一个回调C，则是马上执行

var queueAnimation = function () {
		var animationQueue;
		return queueAnimation;
	function queueAnimation(func) {
		if (animationQueue) {   		//第二次加入func，则加入队列中
	　　　　　　　　animationQueue.push(func);
		} else {
		      animationQueue = [func];  //第一次加入func，则直接加入数组中，并执行
		      flushAnimations();
		}
	}

	function flushAnimations() {
	　　var anim = animationQueue.shift();
	       if (anim) {
		   onReady(function () {
		　　　　var unlocked = false;
		　　　　function unlock() {
			// 防止重复解锁，避免执行多次
			　　if (unlocked) {
			　　　　return;
			    }
			　　unlocked = true;
			   setTimeout(flushAnimations, 0);  //执行下一个动画
		       }

		       anim(unlock);
　　　　		   });
		} else {
		    animationQueue = null;
		}
	}

  }();