在办公室坐久了浑身难受，做一个拉伸计时器，方便跟着运动

收藏了一堆拉伸动作，真做起就乱：这个做几秒？下个是什么？脑子记不住。写了个网页，把一套动作排好序，每个动作倒计时，时间一到自动跳下一个，全程不用我操心数数。这跟普通倒计时不一样——它是"一串步骤串起来自动走"。

一、本质是步骤序列状态机

普通倒计时只有"一个目标时间"。拉伸是"多个步骤，每步自己的时长，做完自动进下一步"。状态就两个：当前在第几步、这步还剩几秒。

const steps = [
  { name: '扩胸运动', sec: 30 },
  { name: '体侧伸展', sec: 30 },
  { name: '颈部绕环', sec: 20 },
  { name: '下蹲拉伸', sec: 25 },
];
let i = 0, left = 0, timer = null;

function runStep() {
  if (i >= steps.length) { finish(); return; }   // 全部做完
  left = steps[i].sec;
  tick();
}
function tick() {
  show(steps[i].name, left);
  if (left <= 0) { i++; runStep(); return; }      // 这步结束，进下一步
  left--;
  timer = setTimeout(tick, 1000);
}

i 是步骤指针，left 是这步倒计时。每跳一步 i++ 再 runStep，到头了 finish()。这就是个最简单的有限状态机。

二、暂停和重来

function pause() { clearTimeout(timer); timer = null; }
function restart() { clearTimeout(timer); i = 0; runStep(); }

暂停只清定时器，保留 i 和 left；重来把指针归零。

三、步骤配置示意

四、每步时长怎么定

时长写在配置数组里，想加动作改数组就行，逻辑一行不用动。

小结

拉伸计时器是"步骤序列状态机"：状态只有当前步索引 i 和本步剩余秒 left，每步倒计时归零就 i++ 推进到下一动作，全部走完触发结束。它和普通倒计时不同——后者只有单一目标，前者是多步串行自动播放。暂停只清定时器保留状态，重来归零指针。动作和时长写在配置数组里，加动作改数据不改逻辑。