年会抽奖怕暗箱：写了个随机抽签工具，保证公平

部门抽奖，用 Excel 点名总有人嘀咕"是不是内定"。我自己写个网页抽签：名单自己填，点一下随机出一个，关键是算法得真随机、不重复。简单 Math.random() 取一个其实有隐患，正经该用洗牌算法。

一、为什么不直接 random 取一个

最朴素的写法：

function pick(list) {
  return list[Math.floor(Math.random() * list.length)];
}

抽一个人还行。但要连续抽、且不重复（比如抽三等奖 3 人），这种写法会"同一个人被抽两次"——因为每次都从全集里取，不剔除已中的。

二、Fisher-Yates 洗牌

正确做法先把名单打乱，再按顺序取，这样每个人只会出现一次，且位置完全随机。

function shuffle(arr) {
  const a = [...arr];                       // 复制，不改原名单
  for (let i = a.length - 1; i > 0; i--) {
    const j = Math.floor(Math.random() * (i + 1));   // 0~i 随机位
    [a[i], a[j]] = [a[j], a[i]];           // 交换
  }
  return a;
}
function draw(list, n = 1) {
  return shuffle(list).slice(0, n);         // 取前 n 个
}

从后往前，每一步把当前位和前面随机一位交换。数学上能保证每个排列等概率，比"随机取再判断有没有抽过"的写法更干净，也不会陷入重复抽取死循环。

三、滚动动画

视觉上让名字快速闪动再停，制造"抽奖感"：

function roll(list, ms = 1500) {
  const box = document.getElementById('result');
  const t0 = Date.now();
  const id = setInterval(() => {
    box.textContent = list[Math.floor(Math.random() * list.length)];
    if (Date.now() - t0 > ms) {
      clearInterval(id);
      box.textContent = draw(list, 1)[0];   // 停下时给真结果
    }
  }, 60);
}

动画只是表演，最终停下的结果用 draw() 算，跟闪烁无关。

四、几种抽取方式对比

小结

抽签别用 Math.random() 反复取一个——连续抽多人会重复命中。正经用 Fisher-Yates 洗牌：从后往前每步与前面随机位交换，数学上保证每个排列等概率、每人只出现一次。复制原数组洗牌避免破坏名单。滚动动画只是表演，最终停在用洗牌结果算出的真值上，跟闪烁无关。