Javascript画布，通过数组的冲突检测不工作

基本上，我有一个制作正方形的程序，将左、右、顶部和底部存储在一个数组中。当它生成一个新的正方形时，它在数组中循环。如果AABB碰撞检测使新的正方形与另一个正方形重叠，则应确保不显示该正方形，然后重试。以下是我编写的代码片段，我认为问题在于：

var xTopsBotsYTopsBotsSquares = [];

//Makes a randint() function.
function randint(min, max) {

    return Math.floor(Math.random() * (max - min + 1)) + min;
}

function checkForOccupiedAlready(left, top, right, bottom) {

    if (xTopsBotsYTopsBotsSquares.length == 0) {

        return true;
    }
    for (i in xTopsBotsYTopsBotsSquares) {
        if (i[0] <= right || i[1] <= bottom ||
            i[2] >= left || i[3] >= top) {/*Do nothing*/} 
        else {

            return false;
        }
    }

    return true;
}

//Makes a new square
function makeNewsquare() {
    var checkingIfRepeatCords = true;

    //DO loop that checks if there is a repeat.
    do {
        //Makes the square x/y positions 
        var squareRandomXPos = randint(50, canvas.width - 50);
        var squareRandomYPos = randint(50, canvas.height - 50);

        //Tests if that area is already occupied
        if (checkForOccupiedAlready(squareRandomXPos, 
                                    squareRandomYPos, 
                                    squareRandomXPos+50, 
                                    squareRandomYPos+50) == true) {

            xTopsBotsYTopsBotsSquares.push([squareRandomXPos, 
                                            squareRandomYPos, 
                                            squareRandomXPos+50, 
                                            squareRandomYPos+50]);

            checkingIfRepeatCords = false;

        }
    }
    while (checkingIfRepeatCords == true);

}

var xTopsBotsYTopsBotsSquares=[]；
//生成一个randint（）函数。
函数randint（最小值、最大值）{
返回Math.floor（Math.random（）*（max-min+1））+min；
}
功能检查占用准备就绪（左、上、右、下）{
if（xTopsBotsYTopsBotsSquares.length==0）{
返回true；
}
用于（我在XTOPSBOTSYTOPBOTS方块中）{
如果（i[0]=top）{/*什么也不做*/}
否则{
返回false；
}
}
返回true；
}
//做一个新的正方形
函数makeNewsquare（）{
var checkingIfRepeatCords=真；
//执行循环，检查是否有重复。
做{
//使x/y位置为正方形
var squareRandomXPos=randint（50，canvas.width-50）；
var squareRandomYPos=randint（50，canvas.height-50）；
//测试该区域是否已被占用
如果（检查占用准备就绪（squareRandomXPos，
方舟，
squareRandomXPos+50，
squareRandomYPos+50）=真）{
XTOPSBOTSYTOPBOTSSquares.push（[squareRandomXPos，
方舟，
squareRandomXPos+50，
squareRandomYPos+50]）；
checkingIfRepeatCords=false；
}
}
while（checkingIfRepeatCords==true）；
}

---

非常感谢您的帮助

我认为您的循环是不正确的，因为您使用

I

作为一个值，而它是一个键：

for (i in xTopsBotsYTopsBotsSquares) {
    if (i[0] <= right || i[1] <= bottom ||
        i[2] >= left || i[3] >= top) {/*Do nothing*/} 
    else {

        return false;
    }
}

for（i在xtopsbotsytopsbots方块中）{
如果（i[0]=top）{/*什么也不做*/}
否则{
返回false；
}
}

可能成为：

for (var i = 0, l < xTopsBotsYTopsBotsSquares.length; i < l; i++) {
    var data = xTopsBotsYTopsBotsSquares[i];

    if (data[0] <= right || data[1] <= bottom ||
        data[2] >= left  || data[3] >= top) {/*Do nothing*/} 
    else {

        return false;
    }
}

for（变量i=0，l

我认为您的循环不正确，因为您使用

I

作为值，而它是一个键：

for (i in xTopsBotsYTopsBotsSquares) {
    if (i[0] <= right || i[1] <= bottom ||
        i[2] >= left || i[3] >= top) {/*Do nothing*/} 
    else {

        return false;
    }
}

for（i在xtopsbotsytopsbots方块中）{
如果（i[0]=top）{/*什么也不做*/}
否则{
返回false；
}
}

可能成为：

for (var i = 0, l < xTopsBotsYTopsBotsSquares.length; i < l; i++) {
    var data = xTopsBotsYTopsBotsSquares[i];

    if (data[0] <= right || data[1] <= bottom ||
        data[2] >= left  || data[3] >= top) {/*Do nothing*/} 
    else {

        return false;
    }
}

for（变量i=0，l

谢谢，很抱歉，我无法回复您！我检查一下是否正确！我很抱歉，但这没用。但是谢谢你的努力=没问题！好吧，它可能无法解决您的问题，但我非常确定它不会与您的问题代码一起工作（因为

I

是

xtopsbotsytopsbotsquares

的索引，而不是实际值）谢谢您，很抱歉我无法回复您！我检查一下是否正确！我很抱歉，但这没用。但是谢谢你的努力=没问题！好吧，它可能无法解决您的问题，但我非常确定它不会与您问题的代码一起工作（因为

I

是

xtopsbotsytopbotsSquares

的索引，而不是实际值）使用

for循环
，而不是
for in
：
for（var I=0；I
你把for…in和for…of搞混了。for…in在索引中迭代，而不是在元素中。for…of在元素中迭代，但目前浏览器对它的支持非常差。请使用
for循环，而不是
for in
：
for（var i=0；i
您会将…in与for…of混淆。for…in在索引中迭代，而不是元素。for…of在元素中迭代，但目前浏览器对它的支持非常差。