主题

主要就是分享一下一个绘图类的内容、包含有基本的划分列columns,以及不定量的切割线，例如：4、6、8、10、12这种,要求呈现出"2+2","3+1","1+3","4" 这种区块组合输出,原本以为挺简单的,通过枚举补漏洞的方式,发现划分情况变多变得不适应了,此处简略做一下分享。

阶段1

最开始对复杂度有误判，觉得用枚举的办法解决好2，4，6的情况应该就差不多了,后来通过补漏洞的方式发现问题越来越多,面临的前置问题解决后,后续的划分问题陡然有点儿无从下手

阶段2

在解决完成前置问题后，尝试了区块的数量+序号判断处理，发现基本无法覆盖情况,于是想到了分割模式的二进制字符串，即："00100"、"01000"、"00010"的分割表述字串,1代表有切线,同时包含顺序内容，用以表示// "2+2"、"1+3"、"3+1"的这种切割划分方式,但后续应该怎么处理依然没清理出来一个思路,没整理出来的思路是"00100"这种情况输出的是2,前置的2没法表示，干扰项有点儿多、陷入了无尽的头脑乱序中。

阶段3解析步骤解析模式：遍历pattern字符串，记录下每次遇到1的位置。计算区块数量：根据1的位置和矩形的列数计算出各部分的宽度。"00100"这种表述,第0位和最后一位是干扰项,因此可以移除干扰。实现代码

function parseCutPattern(pattern, columns) {
  // 记录分割的位置
  let cutPositions = [];
  for (let i = 1; i < pattern.length-1; i++) {
      if (pattern[i] === '1') {
          cutPositions.push(i);
      }
  }
  // 添加起始和结束位置
  cutPositions.unshift(0);
  cutPositions.push(columns);
  // 计算各部分的宽度
  let parts = [];
  for (let i = 0; i < cutPositions.length - 1; i++) {
      let partWidth = cutPositions[i + 1] - cutPositions[i];
      parts.push(partWidth);
  }
  // 调整输出
  let totalParts = parts.reduce((acc, curr) => acc + curr, 0);
  let remainder = columns - totalParts;
  if (remainder > 0) {
      parts[parts.length - 1] += remainder;
  }
  // 格式化输出
  return parts;
}
// 测试函数
console.log(parseCutPattern("00100", 4)); // "2+2"
console.log(parseCutPattern("01000", 4)); // "1+3"
console.log(parseCutPattern("00010", 4)); // "3+1"
console.log(parseCutPattern("00001000", 8)); // "4+4"
console.log(parseCutPattern("00001100", 8)); //
console.log(parseCutPattern("11001101", 8)); //
console.log(parseCutPattern("000000010000", 12)); // "7+5"
console.log(parseCutPattern("0000000010000", 12)); // "8+4"
console.log(parseCutPattern("00000000010000", 12)); // "9+3"
console.log(parseCutPattern("000000000010000", 12)); // "10+2"

处理结果

通过遍历,为0的情况进行补充,其他为1的情况表示有切线,进行输出,直至有切线的内容尽数取尽

        var ind=parseInt(groupIndex);
          if(ind == 0){
           var rec=arr.shift();
           innerHTML = innerHTML + `+${width}×${rec}`;
          sum = parseFloat(Number(sum) + Number(width) * Number(rec)).toFixed(2);
          }else{
            if(groupData.length>0){
              var rec=arr.shift();
              if(rec){
               innerHTML = innerHTML + `+${width}×${rec}`;
             sum = parseFloat(Number(sum) + Number(width) * Number(rec)).toFixed(2);
              }
            }
          }

总结

直到 阶段二，才算是初步掌握了一些规律，之前一直在当任务完成，没有去细想一些规律性的东西,因为时间催的比较急,就想着先简单解决,空出时间去处理后续,奈何，程序上的事情没啥偷懒的空间,思路打开,就有种理当如此的感觉~,挣扎和放弃真就一念之间,解决问题的喜悦还是那么令人心旷神怡,这也许是对煎熬最美好的馈赠~。