像上面这种需求,就是会议室管理。已有的会议会占用一定的时间段。这时候我们通过拖动的方式来选择时间段创建新的会议的时候,就需要新的会议的时间段和已有会议的时间段不能冲突。
我们就需要像上面这样判断多种情况下的冲突。这样的话,我们就需要写很多if...else...,或者switch...case..,甚是麻烦。
ES6中提供了一个Set对象,是一个iterable可遍历的对象。Set对象跟Array对象很类似,最主要的区别就是Set对象中的元素不能重复。
类似的代码如下:
let stime=8; let etime=12;//选中时间段的时间范围 for(let i=0;i<this.meets.length;i++){ let tmp=this.meets[i]; let shour=tmp.starthour; let ehour=tmp.endhour; let set=new Set(); for(let k=stime;k<=etime;k++){ set.add(k); } for(let k=shour+8;k<=ehour+8;k++){ set.add(k); } if(set.size<((etime-stime)+(ehour-shour)+2)){ flag=true; } } if(flag){ //时间段有冲突 }
上面这段代码的逻辑就是利用Set对象元素不能重复的特性,把选中时间段的开始时间和结束时间整数化,已占用时间段的时间范围整数化,并且都add进Set对象中;然后通过判断Set对象的size长度和时间范围格子的数目的大小来区分是否冲突。
如果Set的size小于时间段格子数,则选中时间段和占用时间段冲突。否则就不冲突。
时间段数目也可以通过一个Array对象,把他们放到一个Array对象里面判断长度。代码如下:
let stime=8; let etime=12;//选中时间段的时间范围 for(let i=0;i<this.meets.length;i++){ let tmp=this.meets[i]; let shour=tmp.starthour; let ehour=tmp.endhour; let set=new Set(); let arr=new Array(); for(let k=stime;k<=etime;k++){ set.add(k); arr.push(k); } for(let k=shour+8;k<=ehour+8;k++){ set.add(k); arr.push(k); } if(set.size<arr.length){ flag=true; } } if(flag){ //时间段有冲突 }
这样更容易理解。
而且现在主流浏览器都支持Set,即使不支持,我们现在都是自动化前端开发,无论是vue,angular,typeScript,或者react,都会用到pollyfill进行兼容实现,这些由开发环境编译实现,无需我们担心。