如何优化随机放置图片的JS函数以避免代码重复？

当然可以优化！你觉得没必要两次调用Math.random()的想法完全合理——不过先得说清楚：Math.random()本身的性能开销极低，绝大多数场景下两次调用根本不会有问题。但如果就是想优化调用次数，或者让代码更整洁，这里有几个实用的方案：

• 方案1：用伪随机生成器复用种子（减少Math.random()调用次数）
  如果你的项目需要大量生成随机数，或者想严格控制随机序列，可以自己实现一个简单的伪随机数生成器（PRNG），只初始化一次种子，之后不用再调用Math.random()就能生成随机值。示例代码：

  // 先定义一个轻量的伪随机生成器类
  class SimplePRNG {
    constructor(seed = Date.now()) {
      this.seed = seed % 2147483647;
      if (this.seed <= 0) this.seed += 2147483646;
    }
    random() {
      this.seed = (this.seed * 16807) % 2147483647;
      return (this.seed - 1) / 2147483646;
    }
  }
  
  // 在你的组件/类初始化时创建PRNG实例
  this.prng = new SimplePRNG();
  
  // 优化后的moveImage函数
  moveImage() {
    const maxTop = screen.height - this.imgHeight;
    const maxLeft = screen.width - this.imgWidth;
    this.imgTop = Math.round(this.prng.random() * maxTop);
    this.imgLeft = Math.round(this.prng.random() * maxLeft);
  }
  

  这样每次调用moveImage()时，虽然还是两次“取随机数”的操作，但都是复用同一个PRNG实例，不需要重复调用Math.random()。

• 方案2：代码整洁性优化（不减少调用次数，但更易维护）
  如果只是觉得原代码重复度高、可读性一般，即使保留两次Math.random()调用，也可以重构得更简洁：

  moveImage() {
    // 封装随机位置计算逻辑
    const getRandomPosition = (maxRange) => Math.round(Math.random() * maxRange);
    this.imgTop = getRandomPosition(screen.height - this.imgHeight);
    this.imgLeft = getRandomPosition(screen.width - this.imgWidth);
  }
  

  这种方式遵循DRY（Don't Repeat Yourself）原则，代码更清晰，后续修改逻辑也更方便。

• 方案3：单随机数拆分生成两个偏移（不推荐，仅特殊场景可用）
  如果你硬要只用一次Math.random()生成两个位置，可以把生成的随机数拆分成两部分（比如整数段和小数段），但要注意：这种方式生成的两个值不是完全独立的随机值，会存在相关性，可能影响随机分布。示例：

  moveImage() {
    const maxTop = screen.height - this.imgHeight;
    const maxLeft = screen.width - this.imgWidth;
    const rand = Math.random();
    // 拆分出两个不同的比例值
    const randTop = Math.floor(rand * 1000000) / 1000000;
    const randLeft = rand - randTop;
    this.imgTop = Math.round(randTop * maxTop);
    this.imgLeft = Math.round(randLeft * maxLeft);
  }
  

  除非你有特殊的业务需求，否则不建议用这种方式。

总的来说，除非你有非常严格的性能要求或者特殊的随机序列控制需求，原代码的两次Math.random()调用完全够用。如果只是想优化代码结构，方案2是最实用的选择；如果确实要减少Math.random()的调用次数，方案1是更可靠的方案。

内容的提问来源于stack exchange，提问作者German Varanytsya