JavaScript数组遍历结果不符合预期，如何定位for循环中的错误

问题根源 #

你代码的错误并不在这段for循环的语法逻辑上，问题出在两个核心点：

• 你使用的shuffle是原地修改数组的Fisher–Yates洗牌算法，执行dlArray = shuffle(dlArray);后，原始dlArray的顺序已经被永久打乱，没有保留原始和elArray的索引对应关系。
• 你后续的答案匹配逻辑是直接按elArray[i] : dlArray[i]的索引对应规则绑定的，这时候dlArray已经是打乱后的顺序，自然就出现了k1:d4这类不符合预期的匹配结果。

你当前贴出的for循环仅用来生成elArray对应的可拖拽元素，本身逻辑没有问题。

修复方案 #

洗牌时不要直接修改原始dlArray，先拷贝一份新数组再做洗牌操作，保留原始数组的顺序用于答案匹配：

// 浅拷贝原dlArray后再洗牌，不修改原数组顺序
const shuffledDlArray = shuffle([...dlArray]);
// 渲染打乱后的拖拽选项时用shuffledDlArray，答案匹配仍用原始dlArray

这样调整后，原始dlArray还是保留['d1', 'd2', 'd3', 'd4']的初始顺序，匹配时自然就能得到k1:d1 k2:d2的预期结果。

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