JavaScript 的 for...in 循环如何处理多维数组？

我在玩了一下 JavaScript，发现（至少对我来说）在通过 for...in 循环处理多维数组时有奇怪的行为。所以我有这段代码：

<script type="text/javascript">
  var arr = [['a', 'b'], ['c','d']];

  var first='';

  for (var singleArray in arr) {
    first += ' ' + singleArray[0] + ' ' + singleArray[1];
  }

  var second = '';
  for (var i=0;i<arr.length; i++) {
    second += ' ' + arr[i][0] + ' ' + arr[i][1];
  }

  console.log('First: ', first);
  console.log('Second: ', second);
</script>

输出是：

First: 0 undefined 1 undefined
Second: a b c d

我希望第一个和第二个是相同的。你能解释一下我缺少什么吗？

注意：请不要建议通过 jQuery 或其他方式迭代数组。我没有编码问题，我只是对这种特殊情况感到好奇。

埃里克·米克尔森指出了一些很好的观点，但总结一下。

1. for (... in ...)循环遍历对象属性
2. array是 Javascript 中的一个对象，因此您可以用它迭代数组。但会比较慢，一般不推荐（参见这是为什么 http://bonsaiden.github.com/JavaScript-Garden/#array.general)
3. 事实上，它迭代属性而不是值意味着它返回索引而不是数组值（当您有关联数组时这可能很方便）
4. 问题中的例子可以用以下方法解决for (... in ...) loop

如下：

var third = '';
for (var arrayIndex in arr) {
  third += ' ' + arr[arrayIndex][0] + ' ' + arr[arrayIndex][1];
}

在关联数组示例中for (... in ...)循环会很方便：

var person = [];
person["id"] = 1;
person["born"] = 2009;
person["favourite_meal"] = "chicken"; 

var fourth = '';
for (var arrayIndex in person) {
  fourth += ' ' + person[arrayIndex];
}