Promise 红绿灯效果

前言：关于Promise的一些基本属性，点击进入【 ES6之Promise】。

foo返回一个Promise实例，foos返回并向foo传参，传color和time参数，过了指定的time时间以后，Promise状态就变为resolve，就会触发then方法绑定的回调函数；

let light=document.getElementById("light");
let foo=function(color,time){
	return new Promise(function(resolve,reject){
		setTimeout(function(){
			resolve();
			light.style.background=color;
		},time);
	})
};
let foos=function(){
	light.style.background="yellow";
	return foo("red",3000).then(function(){
		foo("green",4000).then(function(){
			foo("yellow",5000).then(function(){
				foos();
			})
		})
	})
};
foos();

用ES6的箭头函数，可以让代码更简洁；

let light=document.getElementById("light");
let foo=(color,time)=>{
    return new Promise((resolve,reject)=>{
        setTimeout(()=>{
            resolve();
            light.style.background=color;
        },time);
     })
};
let foos=()=>{
    light.style.background="yellow";
    return foo("red",3000).then(()=>
          foo("green",4000).then(()=>
              foo("yellow",5000).then(()=>{
                  foos();
              })
          )
     )
};
foos();