Javascript concat 无法按预期工作 - 未合并

Question

我正在尝试合并来自 for 循环的值，但它不是将它们合并到单个数组中，而是创建单独的数组？

我对Javascript真的很陌生，所以可能误解了如何使用concat函数。我在下面插入了脚本的简化版本，我希望输出将所有值包含在一个数组中。谁能帮我指出正确的方向？

代码

var fixed = document.getElementById('fixed');
var sections = document.getElementsByClassName('section');
for (i = 0; i < sections.length; i++) {
var arr = [];
arr = arr.concat(sections[i]);
fixed.innerHTML = arr;
console.log(arr);
}

<div class="fixed" id="fixed"></div>
<div class="section"></div>
<div class="section"></div>
<div class="section"></div>
<div class="section"></div>
<div class="section"></div>

Answer 1

arr变量必须在循环外部声明一次，而不是每次在循环中重新声明一个名为arr的新变量。

这样，结果将累积在单个数组中。

var fixed = document.getElementById('fixed');
var arr = [], sections = document.getElementsByClassName('section');
for (i = 0; i < sections.length; i++) {
arr = arr.concat(sections[i]);
fixed.innerHTML = arr;
console.log(arr);
}

<div class="fixed" id="fixed"></div>
<div class="section"></div>
<div class="section"></div>
<div class="section"></div>
<div class="section"></div>
<div class="section"></div>

Answer 2

在for 循环之前声明数组，设置fixed.innerHtml之后并阅读 JavaScript 范围。

var fixed = document.getElementById('fixed');
var sections = document.getElementsByClassName('section');
var arr = [];
for (i = 0; i < sections.length; i++) {
arr = arr.concat(sections[i]);
}
fixed.innerHTML = arr;

<div class="fixed" id="fixed"></div>
<div class="section"></div>
<div class="section"></div>
<div class="section"></div>
<div class="section"></div>
<div class="section"></div>