JS多层for循环break或continue到具体层
loop
场景
多层嵌套循环时候,需要控制指定层。
这个内容很早以前就入笔记了,但是一直很少用到,今天刚好碰到一个很复杂的数据结构,就把源码拿出来大家看一下,方便学习。
关键源码
areas.forEach(area => { let topRow = area.topRow let seatRows = area.seatRows seatRows.forEach(seatRow => { out: for(let i = seatRow.start; i <=>
if(seatRow.emptys) { let emptys = seatRow.emptys for(let j = 0; j <>
let empty = emptys[j] if(empty === i) continue out } } seats.push({ top: topRow, left: i, name: '', status: '', seat_type: '', }) } topRow++ })})
这里实现的是座位排布的核心逻辑层,当然可能还没优化好,主要说下主题嘛~
具体各个层级的代码部分截图如下:
生成器
生成器
各区域座位表
座位表
emptys 就是无座位的地方。
因为要做好自动渲染,所以里面穿插了许多辅助字段,让手工代码尽可能的小一点。
效果如下(目前):
手机端效果
具体业务逻辑不做梳理,讲一下主题问题:
一、渲染每行是从左往右按照区域字段start与end来循环。
二、每行都有可能有一些空的座位,那么具体空的放到了一个数组emptys里面。
三、所以需要在循环里面在循环看一下是否是空的位置,如果是则进行后续操作,不把当前位置放进去。
out:for(let i = seatRow.start; i <=>
if(seatRow.emptys) { let emptys = seatRow.emptys for(let j = 0; j <>
let empty = emptys[j] if(empty === i) continue out } } seats.push({ top: topRow, left: i, name: '', status: '', seat_type: '', })}
就是上面这个代码了。
标记就是第一行的那个out,注意带个冒号':',然后到符合条件的地方使用continue out即可。
如果是break,那么就是break out,即跳出结束外层循环,不带就是结束当前层循环。