Проблемы с Javascript

Question

Я делаю игру на Javascript с использованием HTML5 canvas API и наткнулся на контрольно-пропускной пункт.

Одним из игровых эффектов является ракета, движущаяся вверх вдоль оси y, на которую влияют порывы ветра (испускаемые турбинами), которые перемещают ее вдоль оси x. У меня не было проблем с изготовлением одной из этих турбин, но когда их число увеличилось до 3, я столкнулся с проблемой. На новом уровне я создаю эти турбины как объекты, которые затем помещаются в массив, как можно увидеть здесь:

function gameStateNewLevel(){

    for (var i = 0; i < 2; i++){
        turbine = {};
        turbine.width = 10;
        turbine.height = Math.floor(Math.random()*200); //turbine height
        turbine.y = Math.floor(Math.random()*600) //turbine y-axis 
        if (Math.random()*10 > 5){ //indicates turbine side of canvas
            turbine.side = leftSide;
        }else{
            turbine.side = rightSide;
        }
        if(turbine.height <= 100){ //Increases turb. size if it's too small
            turbine.height += Math.floor(Math.random()*100);
        }

        turbines.push(turbine);

    }

    context.fillStyle = "#FFFFFF"       
    switchGameState(GAME_STATE_PLAYER_START);
}

Теперь, прежде чем они будут отрисованы, они также обновляются с помощью функции updateTurbine. Все, что должна делать эта функция, - это убедиться, что турбины не перекрывают друг друга, и перемещать их вверх или вниз по оси y по мере необходимости (путем циклического перемещения по массиву и сравнения каждого из объектов в нем). Я сделал попытку сделать функцию, но я полностью потерян между всеми циклами. Это примерно столько, сколько у меня есть, и у меня такое ощущение, что я на неправильном пути:

function updateTurbines(){
    tempTurbine = {}
    turbinePositionTop = tempTurbine.y;
    turbinePositionBottom = tempTurbine.y + tempTurbine.height;
    for (var i = turbineArrayLength; i < 2; i++){
        tempTurbine = turbines[i];
        for (var i = turbineArrayLength; i < 2; i++){
            if (tempTurbine !== tempTurbines[i]){
                while (){

                }
            }   
        }
    }
}

На сайте www.techgoldmine.com

вы можете найти исходный код и самое дальнее, что у меня получилось без взлома этой вещи.

Answer 1

В вашем коде есть ошибки, см. Комментарии здесь:

function updateTurbines(){
    tempTurbine = {}
    turbinePositionTop = tempTurbine.y; // tempTurbine is an empty object right now so .y is undefined
    turbinePositionBottom = tempTurbine.y + tempTurbine.height; // same problem here
    for (var i = turbineArrayLength; i < 2; i++){ // why am I starting at the end of the array? What's the 2 for?
        tempTurbine = turbines[i];
        for (var i = turbineArrayLength; i < 2; i++){ // why am I doing this twice? I'm also clobbering the value of "i"
            if (tempTurbine !== tempTurbines[i]){
                while (){

                }
            }   
        }
    }
}

Вот как я бы переписал это, не зная, что он делает:

function updateTurbines(){
    var l = turbines[i].length; // get the turbine length directly from the array[1]
    for (var i = 0; i < l; i++){ // go through all of the turbines
        var tempTurbine = turbines[i];
        turbinePositionTop = tempTurbine.y; // now .y is defined because tempTurbine is not an empty object
        turbinePositionBottom = tempTurbine.y + tempTurbine.height;
        for (var j = 0; j < l; j++) { // NOT i but j here
            if (tempTurbine !== tempTurbines[j]){
                while (){
                     // ...
                }
            }   
        }
    }
}

[1] это может привести к ошибкам при изменении массива. Я предполагаю, что вы только добавляете это сейчас.

Answer 2

Ваша проблема, вероятно, в том, что индексы перекрываются;внутренний цикл изменяет значение i для внешнего цикла.

Я изменил i на j во внутреннем цикле.

function updateTurbines(){
    tempTurbine = {}
    turbinePositionTop = tempTurbine.y;
    turbinePositionBottom = tempTurbine.y + tempTurbine.height;
    for (var i = turbineArrayLength; i < 2; i++){
        tempTurbine = turbines[i];
        for (var j = turbineArrayLength; j < 2; j++){
            if (tempTurbine !== tempTurbines[j]){
                while (){
                    //What the heck is going on here?
                }
            }   
        }
    }
}

Дайте мне знать, если это исправленоэто.

Answer 3

Ответы были полезны, но ни один из них не работал ... это код, который я получил в конце.

function updateTurbines(){
    var l = turbines.length; 
    for (var i = 0; i < l; i++){ // go through all of the turbines
        var tempTurbine1 = turbines[i];
        tempTurbine1.PositionTop = tempTurbine1.y; // now .y is defined because tempTurbine is not an empty object
        tempTurbine1.PositionBottom = tempTurbine1.y + tempTurbine1.height;
        for (var j = 0; j < l; j++) { // NOT i but j here
            var tempTurbine2 = turbines[j];
            if (tempTurbine1 !== tempTurbine2 && tempTurbine1.PositionBottom >= tempTurbine2.PositionTop){

    }
   }
  }
 }