嵌套for循环和多维数组

Question

我试图弄清楚嵌套for循环是如何与JavaScipt中的多维数组一起工作的，但有一点让我有些困惑。以股票为例

var arr = [[1,2], [3,4], [5,6]];
for (var i=0; i < arr.length; i++) {
    for (var j=0; j < arr[i].length; j++) {
        console.log(arr[i][j]);
    }
}

这就是我所期望的结果123456。但是，如果我将数字添加到外部数组的末尾：

var arr = [[1,2], [3,4], [5,6], 7, 8];
for (var i=0; i < arr.length; i++) {
    for (var j=0; j < arr[i].length; j++) {
        console.log(arr[i][j]);
    }
}

我仍然得到同样的输出1 2 3 4 5 6？我不明白为什么

var arr = [["a","b"], ["c","d"], "y", "z"];
for (var i=0; i < arr.length; i++) {
    for (var j=0; j < arr[i].length; j++) {
        console.log(arr[i][j]);
    }
}

输出是一个bcdyz，这是我所期望的。为什么字符串的行为会有所不同？

Answer 1

下面是现代Javascript中的情况。

关于循环，所有的值都可以分为“可迭代”和“不可迭代”。迭代的值，你可以很好地...迭代-与for...的循环。

for (let item of someIterableThing)
    // use item

（你不使用裸for循环-for（var i... i

相反，如果你为…做。。。对于，使用不可编辑的内容，您将得到一个错误。

数组和字符串是可iterable值的示例，数字是不可iterable的。所以当你有

[ [1,2], [3,4], "foobar" ]

此数组中的所有项都是可迭代的，您的嵌套循环将正常工作。然而，在

[ [1,2], [3,4], 999]

最后一项不可iterable，嵌套循环将失败。

没有内置的方法来判断未知值是否可迭代，你必须为此编写一个函数：

 let isIterable = x => x && x[Symbol.iterator]

（参见专用主题）。

然后，可以安全地使用嵌套循环：

for (let item of array)
    if (isIterable(item))
        for (let subItem of item)
            console.log(subItem)
    else
        console.log(item)

顺便说一下，网上有很多关于Javascript的过时信息。语言在进化，5年前还不错的东西现在被认为是糟糕的做法。不幸的是，大多数教程、书籍和教师没有跟上，仍然推广旧的做法，比如在循环中使用裸露的。

（既然人们问，为什么循环）的Bug <代码>是不好的，请考虑这个例子：

您有一个数组text，其中包含处理此数组的字符串和多个函数。程序员A以老式的方式编写这些函数：

for (var i = 0; i < text.length; i++)  
     do_something_with(text[i]) // ;(

程序员B用现代的方式编写：

for (let str of text)  
     do_something_with(str) // :)

现在，文本变得越来越大，不再适合内存。所以系统架构师决定用一个一次只能产生一个字符串的可简化文件对象来替换它。程序员A现在必须重写他所有的100个函数来适应新的界面：

  for (var file = TextFile; !file.eof(); file.getNext())
      do_something_with(file.currentLine)

包括很多疼痛、抽搐和头痛。

程序员B只是享受她的假期。）

Answer 2

String、Array、TypedArray、Map和Set都是内置的iTerable，因为它们的每个原型对象都实现了一个@@iterator方法。而编号不可编辑：

const iterate = v => {
  for (var i = 0; i < v.length; i++) console.log(v[i])
}

iterate([1, 'two', 777]) // iterates by element
iterate('abc') // iterates by symbol
iterate(123) // does not iterate

Answer 3

正如其他人提到的，您的内部循环都是关于迭代顶层（非嵌套数组）中的数组。它假设顶级数组中的所有元素都是嵌套数组，但事实并非如此。（在尝试遍历数组之前，需要确保您有一个数组。）由于顶层中的7和8不是数组，arr[i]。length返回数字的未定义，但字符串是“类似数组”的对象，并且具有length属性。一个“y”字符串的长度为1，因此内部循环工作，因为它从零开始，并在“y”的字符串“数组”的零位置处获得字符，即“y”。

但是，这是一个很好的理由，不使用传统的为循环与数组，当我们现在有Array.for每个（），这消除了手动管理索引的需要，并允许我们访问值直接枚举而不用担心索引。

var arr = [[1,2], [3,4], [5,6], 7, 8];
var output = "";

// Enumerate the top-level array:
arr.forEach(function(value){
  // Check to see if the item is an array
  if(value instanceof Array){
    // If so, enuerate that nested array
    value.forEach(function(nestedValue){
      // Add the nested array's value to the output
      output += nestedValue + " " ;
    });
  } else {
    // Item is not an array, just add its value to the output
    output += value + " ";
  }
});

console.log(output);