TypeScript三数升序排序 while循环致页面崩溃排查

页面崩溃是无限死循环直接导致的，你的while循环逻辑存在三处致命错误：

• 循环判断依赖的z1/z2/z3都是用const声明的固定值，循环体内没有任何修改这三个值的逻辑，只要初始状态满足循环条件，代码会永远在循环里跑，直到浏览器页面卡死崩溃。
• 循环条件本身有笔误：第二个while的判断条件写了两次z2 > z1，漏写了z2 > z3的判断，根本没法正确识别z2是最大值的场景；第三个循环的输出逻辑还有笔误，两处都把z2错写成z3，就算不卡死排序结果也是错的。
• 你当前的写法本质是手动枚举所有大小组合，根本没用到循环的排序能力，完全不符合作业要求用循环实现排序逻辑的初衷，而且输出的数字之间没有分隔符，比如2、5、7会直接拼成257，根本读不出正确结果。

课程要求必须用循环实现排序，直接用循环写最基础的冒泡排序即可，不需要手动枚举所有大小情况，逻辑通用也不会出现死循环：

const lego: HTMLButtonElement = document.getElementById("sorter") as HTMLButtonElement;
const z1input: HTMLInputElement = document.getElementById("zahl1") as HTMLInputElement;
const z2input: HTMLInputElement = document.getElementById("zahl2") as HTMLInputElement;
const z3input: HTMLInputElement = document.getElementById("zahl3") as HTMLInputElement;
const outputEl: HTMLElement = document.getElementById("output");

lego.addEventListener("click", () => {
    // 把三个输入值存入数组，方便循环遍历处理
    const numList: number[] = [
        Number(z1input.value),
        Number(z2input.value),
        Number(z3input.value)
    ];

    // 双层循环实现升序冒泡排序，完全满足作业的循环要求
    for (let round = 0; round < numList.length; round++) {
        for (let idx = 0; idx < numList.length - 1 - round; idx++) {
            // 相邻元素比较，前值更大就交换位置
            if (numList[idx] > numList[idx + 1]) {
                const tmp = numList[idx];
                numList[idx] = numList[idx + 1];
                numList[idx + 1] = tmp;
            }
        }
    }

    // 输出排序结果，数字之间加逗号分隔
    outputEl.innerText = `Sortierte Reihenfolge: ${numList.join(', ')}`;
})

如果课程要求必须用while循环，把上面的for循环替换成while写法即可，核心是一定要在循环内部更新参与条件判断的变量，保证循环能触发终止条件，不会无限执行。

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