JavaScript处理含整数及范围子数组时如何仅保留元素不保留范围

问题原因 #

• 原test函数逻辑错误：遍历输入数组时，不管当前元素是整数还是范围子数组，都先直接push到结果数组，导致范围子数组本身也被保留，不符合要求
• 原writeArray函数逻辑错误：遍历数组生成输出内容时，push方法没有传入当前遍历的元素，最终输出内容为空

修正后的完整代码 #

<div class="block" onclick="test([33,88,[1,5],[8,13],[22,25]]);">click</div>
<div id="paper"></div>

<script>
function test(clickArray) {
    let theArray = [];
    for (let i = 0; i < clickArray.length; i++) {
        const current = clickArray[i];
        // 判断当前元素是不是长度为2的范围数组
        if (Array.isArray(current) && current.length === 2) {
            // 是范围数组，直接调用range展开，不把原范围数组push进去
            range(current[0], current[1], theArray);
        } else {
            // 是单个整数，直接push
            theArray.push(current);
        }
    }
    writeArray(theArray);
}

function writeArray(anArray) {
    let pencilArray = [];
    for (let i = 0; i < anArray.length; i++) {
        // 把当前元素push到输出数组
        pencilArray.push(anArray[i]);
    }
    document.getElementById("paper").innerHTML = pencilArray.join("<br>");
}

function range(start, end, rangeArray) {
    for (let i = start; i <= end; i++) {
        rangeArray.push(i);
    }
    return rangeArray;
}
</script>

修改点说明 #

• 调整test函数的判断逻辑：先判断当前元素是不是范围子数组，只有单个整数才直接push，范围子数组直接调用range展开，不保留原子数组
• 修复writeArray的push逻辑，传入遍历到的元素，保证输出内容正常生成
• 补充循环变量i的let声明，避免隐式全局变量污染

内容的提问来源于stack exchange，提问作者Broadsworde