起始相同的蛇形排序瀑布流菜单（一维数组转二维数组）@关尔先生

这是为了解决类似瀑布流菜单排列而产生的算法

1、方法（TEMP：原始数组，COLS_NUM：列数）

  const sortFn = (TEMP, COLS_NUM = 4) => {

const l = TEMP.length;

const MOD = l % COLS_NUM;

const NEW_TEMP = new Array(COLS_NUM).fill(0).map(() => []);

let count = 0;

for (let i = 0; i < l; i++) {

const ITEM = TEMP[i];

let mod = i % COLS_NUM;

const rest = l - i; //  包含当前这一个

if (mod == 0) {

//  计算当前是第几行，从 1 开始

count++;

}

//  偶数行时，逆序分配

if (count % 2 == 0) {

//  当剩下数量不大于 MOD 时，就是最后一行了，逆序起始位改变，以保证最后一行的第一列不为空。

if (rest <= MOD) {

mod = rest - 1;

} else {

//  正常   逆序

mod = COLS_NUM - 1 - mod;

}

}

NEW_TEMP[mod].push(ITEM);

}

2、测试方案，生成 1~100 的数组 new Array(100).fill(0).map((e,i) => i+1)，按 13 列排序

sortFn(
  new Array(100).fill(0).map((e, i) => i + 1),
  13,
);

3、返回结果

4、如果把数组的元素替换成菜单，把数字值看成子菜单的数量，那么返回的二维数组就可以渲染出按子菜单数量排序的瀑布流菜单

---

编辑文章✏