blocks|key|1226374|text|您可以使用嵌套的for循环：|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1226375|​|1226376|let+grid+=+[
++[1,+2,+3],
++[4,+5,+6],
++[7,+8,+9],
];
for(let+i+=+0;+i+<+grid[0].length;+i%2B%2B){
++for(let+j+=+0;+j+<+grid.length;+j%2B%2B)
++++console.log(grid[j][i]);
}|code-block|syntax|javascript|1226377|1226378|entityMap^0|8|3|0|0|0|0^^$0|@$1|2|3|4|5|6|7|P|8|@$9|Q|A|R|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|S|8|@]|D|@]|E|$]]|$1|H|3|I|5|J|7|T|8|@]|D|@]|E|$K|L]]|$1|M|3|G|5|6|7|U|8|@]|D|@]|E|$]]|$1|N|3|-4|5|6|7|V|8|@]|D|@]|E|$]]]|O|$]]

<p>You can use nested <code>for</code> Loops:</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>let grid = [
  [1, 2, 3],
  [4, 5, 6],
  [7, 8, 9],
];
for(let i = 0; i &lt; grid[0].length; i++){
  for(let j = 0; j &lt; grid.length; j++)
    console.log(grid[j][i]);
}</code></pre>
</div>
</div>
</p>


blocks|key|5044768|text|如果数组的长度都相同，你会得到很多有效的答案。这里有一种方法来处理可能不同长度的数组。它基本上一直运行，直到找不到更多的数据：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|5044769|​|5044770|let+grid+=+[
++++[1,+2,+3,+4,+5],
++++[4,+5,+6,+7],
++++[7,+8,+9,+10,+11,+12]
++];

let+current+=+grid,+i+=+0
while(current.length){
++++current+=+grid.filter(arr+=>+i+<+arr.length)
++++current.forEach(arr+=>++console.log(arr[i]))
++++i%2B%2B
}|code-block|syntax|javascript|5044771|5044772|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|L|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|M|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|N|8|@]|9|@]|A|$G|H]]|$1|I|3|C|5|6|7|O|8|@]|9|@]|A|$]]|$1|J|3|-4|5|6|7|P|8|@]|9|@]|A|$]]]|K|$]]

<p>You have a lot of answers that work if the arrays are all the same length. Here's a way to handle potentially different length arrays. It basically runs until it can't find any more data:</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>let grid = [
    [1, 2, 3, 4, 5],
    [4, 5, 6, 7],
    [7, 8, 9, 10, 11, 12]
  ];

let current = grid, i = 0
while(current.length){
    current = grid.filter(arr =&gt; i &lt; arr.length)
    current.forEach(arr =&gt;  console.log(arr[i]))
    i++
}</code></pre>
</div>
</div>
</p>


blocks|key|1260019|text|for(var+i+=+0;+i+<+grid.length;+i%2B%2B)+{
++++var+arr+=+grid[i];
++++for(var+j+=+0;+j+<+arr.length;+j%2B%2B)+{
++++++++console.log("array["+%2B+i+%2B+"]["+%2B+j+%2B+"]+=+"+%2B+arr[j]);
++++}
}|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|1260020|unstyled|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|G|8|@]|9|@]|A|$B|C]]|$1|D|3|-4|5|E|7|H|8|@]|9|@]|A|$]]]|F|$]]

<pre><code>for(var i = 0; i &lt; grid.length; i++) {
    var arr = grid[i];
    for(var j = 0; j &lt; arr.length; j++) {
        console.log("array[" + i + "][" + j + "] = " + arr[j]);
    }
}
</code></pre>


blocks|key|5044619|text|您需要使用嵌套的for循环|type|unstyled|depth|inlineStyleRanges|offset|length|style|BOLD|entityRanges|data|5044620|所以请看我的解决方案：|5044621|​|5044622|let+grid+=+[
+++++[1,2,3],
+++++[4,5,6],
+++++[7,8,9]
];
for+(let+x+=+0;+x+<+grid[0].length;+x%2B%2B)+{
++++for+(let+y+=+0;+y+<+grid.length;+y%2B%2B)+{+
++++++console.log(grid[y][x]);
++++}
}|code-block|syntax|javascript|5044623|5044624|5044625|此网格打印出预期的解决方案：1,+4,+7,+2,+5,+8,+3,+6,+9?|CODE|5044626|5044627|一些解释：|5044628|在本例中，我们使用两个不同的for-loops。|5044629|用于Y+for+(let+y+=+0;+y+<+3;+x%2B%2B)+{}的X+for+(let+x+=+0;+x+<+3;+x%2B%2B)+{}|5044630|the的外部for+(let+y+=+0;+y+<+3;+x%2B%2B)+{}|unordered-list-item|5044631|
的|5044632|5044633|5044634|注意：：这只在网格是矩形的情况下有效，因为使用grid[0].length将会产生错误。|5044635|5044636|编辑：如果您只想使用单个循环，请尝试如下所示：|5044637|5044638|let+grid+=+[
++[1,+2,+3],
++[4,+5,+6],
++[7,+8,+9]
];

for+(let+i+=+0+;+i+<+grid.length+*+grid[0].length+;+i%2B%2B)
+++++console.log(grid[i+%25+grid.length][parseInt(i+/+grid.length)]);|5044639|5044640|entityMap^0|8|5|0|0|0|0|0|0|E|Q|0|0|0|4|0|E|9|0|4|U|11|U|0|6|U|0|0|0|0|0|3|N|E|0|0|0|2|0|0|0|0^^$0|@$1|2|3|4|5|6|7|1I|8|@$9|1J|A|1K|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|1L|8|@]|D|@]|E|$]]|$1|H|3|I|5|6|7|1M|8|@]|D|@]|E|$]]|$1|J|3|K|5|L|7|1N|8|@]|D|@]|E|$M|N]]|$1|O|3|I|5|6|7|1O|8|@]|D|@]|E|$]]|$1|P|3|-4|5|6|7|1P|8|@]|D|@]|E|$]]|$1|Q|3|R|5|6|7|1Q|8|@$9|1R|A|1S|B|S]]|D|@]|E|$]]|$1|T|3|-4|5|6|7|1T|8|@]|D|@]|E|$]]|$1|U|3|V|5|6|7|1U|8|@$9|1V|A|1W|B|C]]|D|@]|E|$]]|$1|W|3|X|5|6|7|1X|8|@$9|1Y|A|1Z|B|S]]|D|@]|E|$]]|$1|Y|3|Z|5|6|7|20|8|@$9|21|A|22|B|S]|$9|23|A|24|B|S]]|D|@]|E|$]]|$1|10|3|11|5|12|7|25|8|@$9|26|A|27|B|S]]|D|@]|E|$]]|$1|13|3|14|5|6|7|28|8|@]|D|@]|E|$]]|$1|15|3|-4|5|12|7|29|8|@]|D|@]|E|$]]|$1|16|3|-4|5|6|7|2A|8|@]|D|@]|E|$]]|$1|17|3|18|5|6|7|2B|8|@$9|2C|A|2D|B|C]|$9|2E|A|2F|B|S]]|D|@]|E|$]]|$1|19|3|-4|5|6|7|2G|8|@]|D|@]|E|$]]|$1|1A|3|1B|5|6|7|2H|8|@$9|2I|A|2J|B|C]]|D|@]|E|$]]|$1|1C|3|I|5|6|7|2K|8|@]|D|@]|E|$]]|$1|1D|3|1E|5|L|7|2L|8|@]|D|@]|E|$M|N]]|$1|1F|3|I|5|6|7|2M|8|@]|D|@]|E|$]]|$1|1G|3|-4|5|6|7|2N|8|@]|D|@]|E|$]]]|1H|$]]

<p>You need to make use of a nested <strong>for loop</strong>:</p>

<p>So please have a look at my solution:</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>let grid = [
     [1,2,3],
     [4,5,6],
     [7,8,9]
];
for (let x = 0; x &lt; grid[0].length; x++) {
    for (let y = 0; y &lt; grid.length; y++) { 
      console.log(grid[y][x]);
    }
}</code></pre>
</div>
</div>
</p>

<hr>

<p>This grid prints out the expected solution: <code>1, 4, 7, 2, 5, 8, 3, 6, 9?</code></p>

<hr>

<p><strong>Some explanation</strong>: </p>

<p>In this case we are using two different <code>for-loops</code>.</p>

<ul>
<li>the outer one for the X <code>for (let x = 0; x &lt; 3; x++) {}</code></li>
<li>the inner one for the Y <code>for (let y = 0; y &lt; 3; x++) {}</code></li>
</ul>

<p><strong>Note</strong>: This will just work if the grid is rectangular because using <code>grid[0].length</code> will otherwise produce an error.</p>

<hr>

<p><strong>Edit</strong>: If you just want to use a single loop try something like this:</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>let grid = [
  [1, 2, 3],
  [4, 5, 6],
  [7, 8, 9]
];

for (let i = 0 ; i &lt; grid.length * grid[0].length ; i++)
     console.log(grid[i % grid.length][parseInt(i / grid.length)]);</code></pre>
</div>
</div>
</p>


blocks|key|1232346|text|​|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1232347|let+grid+=+[
++[1,+2,+3],
++[4,+5,+6],
++[7,+8,+9]
];

let+gridLength+=+grid[0].length;
let+gridHeight+=+grid.length;
for(let+l1=0;+l1<gridLength;l1%2B%2B)+{
++++for(let+l2=0;+l2<gridHeight;l2%2B%2B)+{
++++++++console.log(grid[l2][l1]);
++++}
}|code-block|syntax|javascript|1232348|1232349|假设网格是矩形的(网格通常是矩形的)，您可以遍历它，列第一，行第二，就像这段代码片段一样。|1232350|有一个问题是，如果我们可以在没有2个循环的情况下做到这一点，我们可以，我认为这实际上是更好和更干净的解决方案：|1232351|1232352|let+grid+=+[
++[1,+2,+3],
++[4,+5,+6],
++[7,+8,+9]
];

let+gridLength+=+3;
for(let+l1=0;+l1<gridLength*gridLength;l1%2B%2B)+{
++++console.log(grid[l1%25gridLength][Math.floor(l1/gridLength)]);
}|1232353|1232354|entityMap^0|0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|R|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|S|8|@]|9|@]|A|$E|F]]|$1|G|3|4|5|6|7|T|8|@]|9|@]|A|$]]|$1|H|3|I|5|6|7|U|8|@]|9|@]|A|$]]|$1|J|3|K|5|6|7|V|8|@]|9|@]|A|$]]|$1|L|3|4|5|6|7|W|8|@]|9|@]|A|$]]|$1|M|3|N|5|D|7|X|8|@]|9|@]|A|$E|F]]|$1|O|3|4|5|6|7|Y|8|@]|9|@]|A|$]]|$1|P|3|-4|5|6|7|Z|8|@]|9|@]|A|$]]]|Q|$]]

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>let grid = [
  [1, 2, 3],
  [4, 5, 6],
  [7, 8, 9]
];

let gridLength = grid[0].length;
let gridHeight = grid.length;
for(let l1=0; l1&lt;gridLength;l1++) {
    for(let l2=0; l2&lt;gridHeight;l2++) {
        console.log(grid[l2][l1]);
    }
}</code></pre>
</div>
</div>
</p>

<p>Assuming grid is rectangular(and grids usually are ;)), you can loop through it, columns first, rows second like in this snippet. </p>

<p>There was a question if we can do it without 2 loops, we can and I think its actually better and cleaner solution:</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>let grid = [
  [1, 2, 3],
  [4, 5, 6],
  [7, 8, 9]
];

let gridLength = 3;
for(let l1=0; l1&lt;gridLength*gridLength;l1++) {
    console.log(grid[l1%gridLength][Math.floor(l1/gridLength)]);
}</code></pre>
</div>
</div>
</p>


blocks|key|3576769|text|你只需要找到内部数组和外部数组的大小|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3576770|for(let+i=0;i<countYourArraySize;i%2B%2B)
{
for(let+j=0;j<countYourInnerArayLength;j%2B%2B)
{
console.log(grid[j][i])
}
}|code-block|syntax|javascript|3576771|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>you just have to find the sizes of the inner array and outer array</p>

<pre><code>for(let i=0;i&lt;countYourArraySize;i++)
{
for(let j=0;j&lt;countYourInnerArayLength;j++)
{
console.log(grid[j][i])
}
}
</code></pre>


blocks|key|3576790|text|如果使用map，只需一个(显式)循环即可完成|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|3576791|let+grid+=+[
+[1,2,3],
+[4,5,6],
+[7,8,9]
];
let+result+=+[];
for+(let+i=0;+i+<+grid.length;+i%2B%2B)+{
++++result+=+result.concat(grid.map((row)+=>+row[i])));
}
console.log(result);|code-block|syntax|javascript|3576792|entityMap^0|4|3|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@$9|N|A|O|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|P|8|@]|D|@]|E|$I|J]]|$1|K|3|-4|5|6|7|Q|8|@]|D|@]|E|$]]]|L|$]]

<p>You can do it with just one (explicit) loop if you use <code>map</code>:</p>

<pre><code>let grid = [
 [1,2,3],
 [4,5,6],
 [7,8,9]
];
let result = [];
for (let i=0; i &lt; grid.length; i++) {
    result = result.concat(grid.map((row) =&gt; row[i])));
}
console.log(result);
</code></pre>


blocks|key|1260294|text|您可以在单个循环中完成此操作。但长度必须与此相同|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1260295|let+grid+=+[
++[1,+2,+3],
++[4,+5,+6],
++[7,+8,+9]
];

for+(var+i+=+0;+i+<+grid.length*grid.length;+i%2B%2B)+{
++++var+row+=+Math.floor(i+/+grid.length);
++++var+col+=+i+%25+grid.length;
++++console.log(grid[col][row]);
}|code-block|syntax|javascript|1260296|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>You can do this in a single loop. But the length must same for this</p>

<pre><code>let grid = [
  [1, 2, 3],
  [4, 5, 6],
  [7, 8, 9]
];

for (var i = 0; i &lt; grid.length*grid.length; i++) {
    var row = Math.floor(i / grid.length);
    var col = i % grid.length;
    console.log(grid[col][row]);
}
</code></pre>


<p>how do loop through this 3x3 grid of arrays horizontally and print out 1, 4, 7, 2, 5, 8, 3, 6, 9?</p>

<p>edit: is there a more efficient way of doing this other than to use a two loops that also works if the length of the arrays are not equal to the other ones?</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>let grid = [
  [1, 2, 3],
  [4, 5, 6],
  [7, 8, 9]
];</code></pre>
</div>
</div>
</p>


loop through 2D array horizontally - javascript

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

如何水平遍历这个3x3的数组网格并打印出1，4，7，2，5，8，3，6，9？编辑:除了使用两个循环，如果数组的长度不等于其他数组，有没有更有效的方法？​let grid = [  [1, 2, 3],  [4, 5, 6],  [7, 8, 9]];​

问水平循环二维数组- javascript
EN

回答 8

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问水平循环二维数组- javascriptEN

回答 8

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问水平循环二维数组- javascript
EN