本文介绍如何通过循环动态创建指定数量的障碍物对象并存入数组，替代手动硬编码，从而支持游戏难度分级（如简单6个、中等12个、困难24个），提升代码可维护性与扩展性。
本文介绍如何通过循环动态创建指定数量的障碍物对象并存入数组，替代手动硬编码，从而支持游戏难度分级（如简单6个、中等12个、困难24个），提升代码可维护性与扩展性。
在 Canvas 游戏开发中，为障碍物数组手动声明多个重复结构（如 3 个、6 个甚至 24 个相似对象）不仅冗余，更难以随难度变化灵活调整。理想方案是将障碍物生成逻辑封装为参数化过程：仅需传入目标数量 n，即可自动生成含 n 个独立障碍物对象的数组，每个对象拥有随机但合法的位置坐标。
以下是推荐实现方式（已优化为可复用函数）：
function ChooseRandom(min, max) {
return Math.random() * (max - min) + min;
}
// ✅ 核心函数：按需生成障碍物数组
function createObstacles(count) {
const obstacles = [];
for (let i = 0; i < count; i++) {
obstacles.push({
x: ChooseRandom(500, 2500),
y: ChooseRandom(0, 500),
width: 50,
height: 50
});
}
return obstacles;
}
// ? 根据难度选择障碍物数量
const difficultyLevels = {
easy: 6,
medium: 12,
hard: 24
};
const currentDifficulty = 'medium'; // 可由 UI 下拉菜单或按钮动态设置
const obstacles = createObstacles(difficultyLevels[currentDifficulty]);
// ?️ 渲染所有障碍物
obstacles.forEach(obstacle => {
ctx.fillRect(obstacle.x, obstacle.y, obstacle.width, obstacle.height);
});⚠️ 注意事项与进阶建议：
-
避免重叠：当前逻辑未检测障碍物坐标冲突。若需减少密集重叠，可在
push前添加简易距离校验（例如检查新障碍物与已有障碍物中心距离是否大于minDistance）； - 性能优化：当障碍物数量较大（如 >50）且需高频更新时，建议结合对象池（Object Pooling）复用对象，避免频繁内存分配；
-
动态增删：真实游戏中障碍物应持续生成/移除（如飞出画布后
splice或标记为inactive）。此时推荐使用obstacles = obstacles.filter(...)配合时间戳或位置判断； -
配置集中化：将
width/height/xRange/yRange等参数提取为配置常量，便于后续统一调整美术规格或平衡性。
通过该模式，你不仅能大幅精简初始化代码，更能轻松对接难度选择 UI——只需改变 currentDifficulty 的值，整个障碍物系统即自动适配，真正实现「一次编写，多级复用」。
