javascript时间排序算法实现活动秒杀倒计时效果
制做一个活动页面秒杀列表页需要一个时间的算法排序自己琢磨了半天想了各种算法也没搞出来，后来问了下一个后台的php同学他写了个算法给我看了下，刚开始看的时候觉得这就是个纯算法，不能转化成页面的dom效果，可是再看了两遍发现可以，于是我就改了改，实现了，先分享给大家。
页面需求是：从11点到20点每隔一个小时一场秒杀如果是当前时间就显示正在秒杀之前的商品就往最后排以此类推
类似最开始的11点顺序是11,12,13,14,15,16,17,18,19,20（点）；
到12点的顺序是12,13,14,15,16,17,18,19,20，11（点）
到13点的顺序是13,14,15,16,17,18,19,20，12,11（点）
。。。。。
最后的顺序是20，19，18，17，16，15，13，12，11（点）
这是后台同学的那个纯算法
functionshow_test(hour)
{
p=['13dian','14dian','15dian','16dian','17dian','18dian','19dian','20dian'];
console.log('原顺序是');
console.log(p);
date=newDate();
curHour=date.getHours();
pos=curHour-13;
//pos=hour;
s='活动'+p[pos]+"正在进行";
console.log(s);
desc='当前的顺序应该是';
p.reverse();
console.log(pos);
tmp=[]
for(i=0;i<pos;i++){
tmp.push(p.pop());
}
p.reverse();
p=p.concat(tmp.reverse());
console.log(desc);
console.log(p);
console.log("\n\n");
}
调用
varcurHour=newDate().getHours(); show_test(curHour);
这个算法完美的实现所需要的那种需求所表述的样子可是问题来了怎么真正的转换为页面，于是琢磨之后我将它完美实现;
//首先定义一个包含了每个秒杀的商品的id和图片的数组img1是商品图片img2是秒杀时间img3是商品描述
vardata=[
{id:1,
time:11,
img1:"1.jpg",
img2:"11.jpg",
img3:"111.jpg"
},
{id:2,
time:12,
img1:"2.jpg",
img2:"22.jpg",
img3:"222.jpg"
},
{id:3,
time:13,
img1:"3.jpg",
img2:"33.jpg",
img3:"333.jpg"
},
{id:4,
time:14,
img1:"4.jpg",
img2:"44.jpg",
img3:"444.jpg"
},
{id:5,
time:15,
img1:"5.jpg",
img2:"55.jpg",
img3:"555.jpg"
},
{id:6,
time:16,
img1:"6.jpg",
img2:"66.jpg",
img3:"666.jpg"
},
{id:7,
time:17,
img1:"7.jpg",
img2:"77.jpg",
img3:"777.jpg"
},
{id:8,
time:18,
img1:"8.jpg",
img2:"88.jpg",
img3:"888.jpg"
},
{id:9,
time:19,
img1:"9.jpg",
img2:"99.jpg",
img3:"999.jpg"
},
{id:10,
time:20,
img1:"10.jpg",
img2:"101.jpg",
img3:"1010.jpg"
}
];
//对象数组排序
functioncompare(propertyName){
returnfunction(object1,object2){
varvalue1=object1[propertyName];
varvalue2=object2[propertyName];
if(value2<value1){
return-1;
}elseif(value2>value1){
return1;
}else{
return0;
}
}
}
//因为现在的数组已经变成了一个复杂的数组所以排序要用到根据对象的某个属性排序这歌方法
//这个方法在javascript高级程序设计里面有提到过
functionitemShow(hour)
{
p=data;
//当前时间
curHour=hour;
//对应时间的数组下标
pos=curHour-11;
if(pos<=0){//如果没到11点就显示最开始的顺序
pos=0;
}elseif(pos>=9){//如果超过20点就完全倒序
pos=9
}
s='活动'+p[pos]+"正在进行";
console.log(s);
//根据数组里的时间这个属性反向排序
p.reverse(compare("time"));
console.log(pos);
console.log(p);
//定义一个临时数组存放过时的商品项
tmp=[]
for(i=0;i<pos;i++){
tmp.push(p.pop());
}
//将剩余的再反相排序
p.reverse(compare("time"));
//将未到秒杀时间的商品项目与已经过期的数组链接
p=p.concat(tmp.reverse(compare("time")));//
console.log(desc);
console.log(p);
for(vari=0;i<data.length;i++){
if(i==0){//正在秒杀
$(".item").eq(0).append("<imgsrc='"+p[i].img1+"'id="+p[i].id+">")
$(".item").eq(0).append("<imgsrc='"+"killsecond_now.jpg"+"'>")
$(".item").eq(0).append("<imgsrc='"+p[i].img3+"'>")
}else{
$(".item").eq(i).append("<imgsrc='"+p[i].img1+"'id="+p[i].id+">")
$(".item").eq(i).append("<imgsrc='"+p[i].img2+"'>")
$(".item").eq(i).append("<imgsrc='"+p[i].img3+"'>")
}
}
}
这样就把算法实现成页面展示了，希望大家可以有所收获，理解javascript时间排序算法。