用 JavaScript 实现 2048：移动与合并的核心逻辑

2048 可以用一个 4×4 二维数组表示棋盘，0 代表空格。界面用 CSS Grid 绘制，键盘事件负责触发移动，核心算法只处理数组，便于独立验证。

1. 先实现一行向左移动

规则是：去掉空格，相邻同值合并一次，再在右侧补零。每次合并把新数字加入本轮得分。

function slideLeft(row) {
  const values = row.filter(n => n !== 0);
  const result = [];
  let score = 0;
  for (let i = 0; i < values.length; i++) {
    if (i + 1 < values.length && values[i] === values[i + 1]) {
      const merged = values[i] * 2;
      result.push(merged);
      score += merged;
      i++; // 跳过已参与合并的数字
    } else {
      result.push(values[i]);
    }
  }
  while (result.length < row.length) result.push(0);
  return { row: result, score };
}

例如 [2, 0, 2, 4] 得到 [4, 4, 0, 0]，本轮加 4 分；[2, 2, 2, 2] 得到 [4, 4, 0, 0]，不能继续合并成 8。跳过已合并元素，可以保证每个方块每轮只合并一次。

2. 复用到四个方向

左移直接处理各行；右移先反转一行，处理后再反转。上移按从上到下的顺序取出各列；下移反转列后处理，再按原位置写回。这样四个方向共用同一套合并逻辑。

3. 更新棋盘与结束判定

每次移动先保存旧棋盘，再比较新旧数组。只有棋盘发生变化，才在随机空格生成一个新数字：通常 90% 为 2、10% 为 4。初始化时生成两个数字，避免无效按键也增加方块。

出现 2048 时提示获胜；没有空格，且任意横向、纵向相邻数字都不相等时，判定无法继续移动。渲染与计算分开后，还可以加入分数显示、重新开始和 localStorage 存档。

实现时重点检查三种情况：连续相同数字、带空格的合并，以及无效移动。先保证规则正确，再添加动画，调试会轻松很多。