分配所有元素后二维数组为空（JavaScript）答案

【问题标题】：Two dimensional array is empty after assigning all of the elements (JavaScript)分配所有元素后二维数组为空（JavaScript）
【发布时间】：2023-01-12 23:58:17
【问题描述】：

我正在尝试读取 .csv 文件形式的表格并将数据放入二维数组中。我设法将数据放入一维数组，但将其转换为二维数组似乎对我不起作用。

这是我想出的代码。没有错误显示；然而，当尝试打印新二维数组的元素时，它们似乎都是空的。

const myForm = document.getElementById("myForm");
const csvFile = document.getElementById("csvFile");


myForm.addEventListener("submit", function() {

  const input = csvFile.files[0];
  const reader = new FileReader();


  reader.readAsText(input);
  reader.onload = function() {
    text = reader.result;

    var table1D = [];
    table1D = text.split(",");

    var table1DLength = table1D.length;
    var table2D = [];
    var numberOfColumns = 46;
    var numberOfRows = 32;

    for (var i = 0; i < numberOfRows; i++) {
      for (var j = 0; j < numberOfColumns; j++) {
        table2D[i] = [];
      }
    }



    for (var k = 0; k < table1DLength; k++) {
      for (var i = 0; i < numberOfRows; i++) {
        for (var j = 0; j < numberOfColumns; j++) {
          table2D[i][j] = table1D[k];
        }
      }
    }
    document.write(table2D[0][0]); // this doesn't print out anything, no matter which element

  };

  reader.onerror = function() {
    document.write("ERROR");
  };

});

<form id="myForm">
  <input type="file" id="csvFile" accept=".csv" />
  <br />
  <input type="submit" value="Submit" />

</form>

【问题讨论】：

table2D[i] = [];也许你应该只使用一个对象来做到这一点？你需要一个二维数组吗？
您忘记阻止表单提交。见How to prevent form from being submitted?。

标签： javascript arrays multidimensional-array

【解决方案1】：

有很多事情不对劲。这是一个以可预测的方式使用 ES6 的固定版本

const myForm = document.getElementById("myForm");
const csvFile = document.getElementById("csvFile");
const pre = document.getElementById('pre');
window.addEventListener('DOMContentLoaded', () => {
  myForm.addEventListener("submit", e => {
    e.preventDefault();
    const input = csvFile.files[0];
    const reader = new FileReader();
    reader.addEventListener('error', function() {
      pre.textContent = "ERROR";
    });
    reader.addEventListener('load', function() {
      const text = reader.result;
      const arr = text.split(/
?
/)
        .map(line => line.split(","));
        console.log(arr)
      pre.textContent = arr.join('
')
    });
    reader.readAsText(input);
  });
});

<form id="myForm">
  <input type="file" id="csvFile" accept=".csv" />
  <br />
  <input type="submit" value="Submit" />

</form>
<pre id="pre"></pre>

【讨论】：