如何使用Javascript将简单数组转换为三维数组（矩阵）答案

【问题标题】：How to convert simple array into three-dimensional array (matrix) with Javascript如何使用Javascript将简单数组转换为三维数组（矩阵）
【发布时间】：2020-03-08 22:56:04
【问题描述】：

假设我有一个数组：

DATA = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12 ,13 ,14 ,15 ,16, 17, 18, 19, 20, 21, 22, 23];

我希望它转换为 3 维数组（（行 x 列的矩阵）x SET by Number of Instances，如下所示：

A = [[1, 2, 3], [4, 5, 6],[7, 8, 9];
B =  [[10, 11, 12], [13, 14, 15], [16, 17, 18]];
C = [[19, 20, 21], [22,23]]

注意，矩阵的行和列是可变的。这意味着行或列中的项数可能会发生变化，甚至数据集中的项数也可能不同。

我希望能够将这些数组集迭代成在创建时包含在特定定义类中的集合。

预期结果：（生成的表包括 html 结构）：

<CONTAINER>
//A SET
<div class "set">
   ROW 1: <row><div class "items"> 1 </div><div class "items"> 2</div><div class "items"> 3</div></row>
   ROW 2: <row><div class "items"> 4</div><div class "items"> 5</div><div class "items"> 6</div><row> 
   ROW 3: <row><div class "items"> 7</div><div class "items"> 8</div><div class "items"> 9</div></row>
 </div>
</div>

//B SET
<div class "set">
       ROW 1: <row><div class "items"> 10</div><div class "items"> 11</div><div class "items"> 12</div></row>
       ROW 2: <row><div class "items"> 13</div><div class "items"> 14</div><div class "items"> 15</div><row> 
       ROW 3: <row><div class "items"> 16</div><div class "items"> 17</div><div class "items"> 18</div></row>
     </div>
    </div>

//C Set
<div class "set">
           ROW 1: <row><div class "items"> 19</div><div class "items"> 20</div><div class "items"> 21</div></row>
           ROW 2: <row><div class "items"> 22</div><div class "items"> 23</div></row>
         </div>
        </div>



</CONTAINER>

可以在此处找到此问题的解决方案：Vue.js - How to convert a simple array to dynamic NxNxN Matrix

【问题讨论】：

这能回答你的问题吗？ How to convert simple array into two-dimensional array (matrix) with Javascript
3-dimensional .... N x M .... 我只计算 NxM 中的两个维度
你的问题很混乱，认为你还没有首先解决它。你必须准确，所以：列数可能会改变，在每个.set 行中，你总是有额外的 3 行（或没有？），而不是你的显示完全令人困惑 - 你是如何订购 A（1）， A(2), A(4), A(5), A(7), A(8)???
@roottraveller - 不，这没有帮助。那只是一个二维数组，如果您没有注意到（根据问题的名称和布局），我厌倦了从 Stack 溢出帖子中构建这个问题。

标签： javascript jquery arrays vue.js

【解决方案1】：

这是转换为 3d 数组

const chunk = (arr, number) => {
   const chunked = arr.reduce((res, value, ind) => {
      if (ind % number === 0) {
         res.push([])
      }  
      res[res.length - 1].push(value)
      return res
   }, [])

   const last = chunked[chunked.length - 1]
   let empty = last[last.length - 1]
   if (Array.isArray(empty)) {
      empty = new Array(empty.length).fill(null)
   } else {
      empty = null
   }
   while(last.length < number) last.push(empty)

   return chunked
}

const _2d = chunk([7, 4, 2, 3, 9], 2)
console.log(_2d)

const _3d = chunk(_2d, 2)
console.log(_3d)

【讨论】：