在JavaScript开发的实际场景中，经常需要将一个原始数组按照特定的约束条件拆分成多个子数组，基于尺寸数组与最大尺寸规则的分组策略就是其中一种典型需求。这种策略需要结合预设的尺寸数组和单个元素的最大尺寸限制，将原始数组的元素合理分配到不同的分组中，确保分组结果符合业务设定的规则。
核心规则定义
要实现这种动态分组策略，首先需要明确两个核心规则的定义：
- 尺寸数组：是一个预定义的数字数组，数组中的每个元素代表对应分组的允许最大总尺寸，比如尺寸数组为[5, 10]时，第一个分组的总尺寸不能超过5，第二个分组的总尺寸不能超过10。
- 最大尺寸规则：是指原始数组中的每个元素都有一个对应的尺寸值，单个元素的尺寸不能超过这个最大尺寸限制，否则该元素无法被分配到任何分组中。
实现思路拆解
整个分组过程可以按照以下步骤推进：
1. 参数校验
首先对输入的参数进行合法性校验，包括原始数组、尺寸数组、最大尺寸规则是否有效，避免后续逻辑出现异常。
2. 初始化分组容器
根据尺寸数组的长度，初始化对应数量的分组容器，同时记录每个分组当前已占用的总尺寸。
3. 遍历原始数组元素
逐个遍历原始数组中的每个元素，获取元素的尺寸值，先判断是否符合最大尺寸规则，再依次尝试分配到各个分组中，直到找到第一个可以容纳该元素的未填满分组。
4. 处理无法分配的元素
如果某个元素无法分配到任何已有的分组中，可以将其放入单独的无分组容器中，方便后续业务处理。
完整代码实现
下面是符合上述思路的完整JavaScript实现代码：
// 定义分组函数，接收原始数组、尺寸数组、获取元素尺寸的方法、最大尺寸限制
function dynamicGroupBySize(originalArray, sizeArray, getElementSize, maxSizeLimit) {
// 参数校验
if (!Array.isArray(originalArray) || !Array.isArray(sizeArray)) {
throw new Error('原始数组和尺寸数组必须是数组类型');
}
if (typeof getElementSize !== 'function') {
throw new Error('获取元素尺寸的方法必须是函数');
}
if (typeof maxSizeLimit !== 'number' || maxSizeLimit <= 0) {
throw new Error('最大尺寸限制必须是大于0的数字');
}
// 初始化分组结果，每个分组包含元素列表和当前总尺寸
const groups = sizeArray.map(maxGroupSize => ({
elements: [],
currentTotalSize: 0,
maxSize: maxGroupSize
}));
// 存放无法分配的元素
const ungroupedElements = [];
// 遍历原始数组的每个元素
for (const element of originalArray) {
const elementSize = getElementSize(element);
// 校验元素尺寸是否符合最大尺寸规则
if (elementSize > maxSizeLimit) {
ungroupedElements.push(element);
continue;
}
// 尝试将元素分配到第一个可以容纳它的分组
let assigned = false;
for (const group of groups) {
// 判断分组是否还能容纳当前元素
if (group.currentTotalSize + elementSize <= group.maxSize) {
group.elements.push(element);
group.currentTotalSize += elementSize;
assigned = true;
break;
}
}
// 如果没有分组可以容纳，放入未分组列表
if (!assigned) {
ungroupedElements.push(element);
}
}
return {
groups: groups.map(group => group.elements),
ungroupedElements
};
}
使用示例
下面通过一个具体的使用案例来演示该分组函数的效果：
// 原始数组，每个元素是包含id和size属性的对象
const originalItems = [
{ id: 1, size: 2 },
{ id: 2, size: 3 },
{ id: 3, size: 4 },
{ id: 4, size: 1 },
{ id: 5, size: 6 },
{ id: 6, size: 2 }
];
// 尺寸数组，第一个分组最大总尺寸5，第二个分组最大总尺寸10
const sizeArr = [5, 10];
// 获取元素尺寸的方法
const getSize = (item) => item.size;
// 最大尺寸限制，单个元素尺寸不能超过5
const maxLimit = 5;
// 调用分组函数
const result = dynamicGroupBySize(originalItems, sizeArr, getSize, maxLimit);
console.log('分组结果：', result.groups);
console.log('未分组元素：', result.ungroupedElements);
上述示例中，元素5的size为6，超过了最大尺寸限制5，所以会被放入未分组列表。剩下的元素会按照顺序分配到两个分组中，第一个分组总尺寸不超过5，第二个分组总尺寸不超过10，最终得到的分组结果符合预设规则。
边界情况处理
在实际使用中还需要注意一些边界情况：
- 如果尺寸数组为空，那么所有元素都会被放入未分组列表。
- 如果原始数组为空，返回的分组结果都是空数组，未分组列表也为空。
- 如果某个元素的尺寸为0或者负数，需要根据业务需求调整校验逻辑，上述代码中默认允许尺寸为0的元素，负数尺寸会被视为不符合规则。
- 如果尺寸数组中的某个分组最大尺寸小于0，该分组永远不会被分配到元素，相当于无效分组。
策略优化方向
上述实现是基础版本的分组策略，还可以根据业务需求进行优化：
- 如果需要更均匀的分组效果，可以调整分配逻辑，优先选择当前总尺寸最小的分组进行分配，而不是按顺序分配。
- 如果需要支持动态扩展分组，可以在所有已有分组都无法容纳元素时，自动创建新的分组，而不是放入未分组列表。
- 如果需要处理元素的优先级，可以在遍历元素前先按照优先级排序，确保高优先级的元素优先被分配到合适的分组中。
JavaScript数组分组尺寸数组最大尺寸规则dynamic_grouping修改时间：2026-06-30 15:27:31