javascript - Mootools 与 jQuery 的奇怪 bug 冲突

Question

尝试运行下面的代码:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script> b = jQuery.noConflict(true); </script>

<script src="http://ajax.googleapis.com/ajax/libs/mootools/1.2.3/mootools-yui-compressed.js"></script>
<script>
  (function($){  
    $.a = function(){
      var x = [];
      for (l in x){
        console.log(l);
      }
    };
  })(b);

  b.a();
</script>

即使 x 为空，在 console.log 中您仍会看到一些值。为什么会发生这种情况？我已经无计可施了。

有人可以建议如何解决这个问题吗？

Answer 1

MooTools 大量 extends Array.prototype，并且您正在使用 for...in 语句迭代数组。

此语句用于迭代对象属性，对于数组，建议使用传统的 for 或 while 循环。

为什么？ 因为正如您所注意到的，for...in 语句会爬行原型(prototype)链，也因为迭代的顺序是任意的，迭代数组可能会不按数字顺序访问元素。

但是，如果您仍然想使用此语句进行迭代，则可以使用 hasOwnProperty 在循环内部进行检查，以确保您将迭代的属性直接出现在对象上，而不是原型(prototype)链上的某个位置功能:

var x = [];
for (l in x){
  if (x.hasOwnProperty(l)) {
    console.log(l);
  }
}