如何更新函数返回的变量？视频ID回退功能实现遇阻

问题分析 #

你当前的核心问题是：只在初始化阶段调用了一次newVideo()获取ID，后续每次调用newVideo()时，既没有更新外部的rando变量，也没有重新执行数组的维护逻辑。这就导致vidids数组只会在页面加载时被修改一次，后续生成新视频时完全不会更新。

解决方案：封装逻辑，绑定ID生成与数组维护 #

最优雅的方式是把「生成新视频」和「维护最近两个ID」的逻辑封装到一个函数里，确保每次调用时自动完成所有操作：

// 初始化存储最近两个视频ID的数组
let vidids = [];

function newVideo(){ 
  let rando = Math.floor((Math.random() * 3970) + 1); 
  document.getElementById("vsrc").src = "https://raw.githubusercontent.com/ondersumer07/vinematik-videos/master/vid/" + rando + ".mp4"; 
  document.getElementById("videoEl").load(); 
  return rando; 
}

// 新增包装函数：负责生成新视频并维护ID数组
function addNewVideo() {
  // 每次调用都获取最新的视频ID
  const newVideoId = newVideo();
  
  // 将新ID追加到数组末尾
  vidids.push(newVideoId);
  
  // 如果数组长度超过2，删除最早的那个ID
  if (vidids.length > 2) {
    vidids.shift();
    console.log("已删除最早的视频ID");
  } else {
    console.log("已添加新的视频ID");
  }
  
  // 可选：返回新ID或当前数组，方便外部使用
  return newVideoId;
}

使用方式 #

之后每次需要生成新视频时，直接调用addNewVideo()即可，无需再单独处理rando变量和数组逻辑。比如：

// 点击按钮生成新视频并更新ID数组
document.getElementById("yourButtonId").addEventListener('click', () => {
  addNewVideo();
  // 此时vidids数组已经自动更新，始终保留最近两个ID
  console.log("当前最近两个视频ID：", vidids);
});

为什么原来的代码不生效？ #

你原来的代码中：

1. let rando = newVideo();只在页面初始化时执行了一次，后续调用newVideo()并没有把返回值重新赋值给rando；
2. 数组的判断逻辑（if (vidids.length < 2)）也只在初始化时运行了一次，没有和newVideo()的调用绑定，所以后续生成新视频时数组完全不会被修改。

内容的提问来源于stack exchange，提问作者Önder Sümer