用于遍历网格的递归函数变得疯狂

当用户单击表格中的某个块（请参阅屏幕截图）时，我想查找具有相同颜色的所有相邻块。我试图递归地做到这一点，但如果我尝试使用三块以上的块，它有时会变得疯狂并且一遍又一遍地调用自身，直到程序崩溃。用于遍历网格的递归函数变得疯狂

据我所看到的，这些对象被添加到数组中，但不知何故，我的测试失败并且一遍又一遍地添加相同的对象。

任何有关这个问题可能的解决方案以及如何解决这个问题都会受到很大的关注！

这里有一个screenshot

这是调用的函数，当用户点击一个块：

var $matchArray; 
$('.block').click(function() { 

    $matchArray = [$(this)]; 

    var $colorClass; 

    if ($(this).hasClass('red')) { 
     $colorClass = 'red'; 
    } else if ($(this).hasClass('green')) { 
     $colorClass = 'green'; 
    } else if ($(this).hasClass('blue')) { 
     $colorClass = 'blue'; 
    } else { 
     $colorClass = 'error'; 
    } 

    findAllSameColorNeighbours($(this), $colorClass); 

});

这是递归方法：

findAllSameColorNeighbours = function ($this, $colorClass) { 

    $this.css('border-style', 'solid'); 

    //LEFT 
    var $leftBlock = isLeftBlockSameColor($this, $colorClass); 
    if ($leftBlock != null) { 
     if (!(arrayContains($matchArray, $leftBlock))) { 
      $matchArray.push($leftBlock); 
      findAllSameColorNeighbours($leftBlock, $colorClass); 
     } 
    } 

    //ABOVE 
     //same as for LEFT 
    //RIGHT 
     //same as for LEFT 
    //BELOW 
     //same as for LEFT 
}

这是怎么了我发现邻近的细胞，据我所见，这些工作很好。我有一个为每个方向：

isLeftBlockSameColor = function ($block, $color) { 
    var $this = $block; 
    var $tr = $this.parent().parent(); 
    var col = $tr.children().index($this.parent().prev()); 
    var $leftBlock = $this.parent().siblings().eq(col).children(); 
    var $blockClassMatch = $leftBlock.hasClass($color); 

    if ($blockClassMatch) { 
     return $leftBlock; 
    } 
    else { 
     return null; 
    } 
};

这里有一些帮助方法，以找出是否该对象已在阵列中或没有。我使用行和单元格的索引来创建一种纬度和长度的东西。

arrayContains = function ($array, $object) { 

    for (i = 0; i < Array.length; i++) { 
     if (compareIndex($array[i], $object)) { 
      say('true'); 
      return true; 
     } 
    }; 
    return false; 
}; 

compareIndex = function ($obj1, $obj2) { 

    if ((getRowIndex($obj1)) === (getRowIndex($obj2)) { 
     if ((getCellIndex($obj1)) === (getCellIndex($obj2)) { 
      return true; 
     } else { 
      return false; 
     } 
    } else { 
     return false; 
    } 

}; 

getCellIndex = function ($this) { 
    var $tr = $this.parent().parent(); 
    var index = $tr.children().index($this.parent()); 
    return index; 
}; 

getRowIndex = function ($this) { 
    var $tr = $this.parent().parent(); 
    var index = $tr.index(); 
    return index; 
};

来源

2015-08-08 PeCeSe

你应该提供一个代码片段或复制的jsfiddle您的问题 –

@PeCeSe，我会建议使用jQuery的查找替换递归的逻辑。当然，你不能直接做到这一点。尝试按类设置颜色，并使用“find”来查找类。 OMG !!! – Lordbalmon

arrayContains函数中存在一个错误。循环只会迭代一次，因为Array.length等于1（正如我使用Chrome浏览器测试的，但我不知道为什么）。您应该使用$array.length。

arrayContains = function ($array, $object) { 
     //for (i = 0; i < Array.length; i++) { 
     for (i = 0; i < $array.length; i++) { 
      if (compareIndex($array[i], $object)) { 
       say('true'); 
       return true; 
      } 
     }; 
     return false; 
    };

来源

2015-08-08 19:01:39

Dat错字！非常感谢你，我可以一直盯着这整晚没有找到它！ – PeCeSe

用于遍历网格的递归函数变得疯狂

回答

相关问题