javascript - Mootools 破坏了我的全局变量!!!谷歌地图 + Mootools

Question

我在 Google map 应用程序中使用 Mootools 来做一些事情，例如 bumpboxes 和其他东西。在我添加 Mootools 脚本之前，一切都 100% 正常工作，无论我是在声明我的全局变量之前还是之后添加脚本，Mootools 都会杀死它们……看一个片段

<script language="javascript" type="text/javascript" src="mootools.js"></script>
<script language="javascript" type="text/javascript" src="bumpbox.js"></script>

<script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript">
</script>
<script type="text/javascript">

    var currentBounds;
    var currentMarker = null;
    var currentInfo = null;
    var markersArrayProps = [];
    var markersArrayAreas = [];
</script>

还有很多...但这只是显示了正在发生的事情，如果我删除调用 mootools.js 的行，一切都会正常进行。基本上 markersArrayProps 在 XMLHTTPRequest 期间是这样填充的:

markersArrayAreas.push(marker);

然后有一个 map 空闲的事件监听器，它会进行一些计算以查看是否应该删除区域标记，并根据 map 的边界加载属性标记。无需深入了解细节，但每当调用此 idle 函数时，我都会像这样遍历数组:

function clearAreaOverlays() {
  if (markersArrayAreas) {
    for (i in markersArrayAreas) {
      markersArrayAreas[i].setMap(null);
    }
  }
}

它返回 markersArrayAreas[i].setMap() 不是函数。只有页面中包含 mootools 脚本，如果我删除 mootools，一切正常。有什么想法吗？

Answer 1

解决此问题的最简单方法是使用以下模式重写循环:

for(var i=0,l=markersArrayAreas.length, i<l, i++) { if(i in markersArrayAreas) { ... } }

看起来您正在使用 markersArrayAreas 作为标准整数索引数组。因此，您不应使用 (for i in array) 模式来遍历它。首先，它比使用基于索引的计数循环效率低得多。

此外，此模式遍历对象的所有成员。在您的情况下，MooTools 已使用更多自定义函数扩展 Array 原型(prototype)，因此无论何时创建数组，现在对象中除了编号的数组值之外还有其他属性。如果打印 i 的值，您应该会看到它不再只是数字。

您可以通过使用 hasOwnProperty 函数检查每个属性名称是否引用不是从原型(prototype)继承的属性来解决这个问题，但是同样，这将比效率低得多。

有关显示这些不同循环结构的相对性能的快速基准，请参见此处:http://jsperf.com/for-in-test