javascript - 在 JavaScript 中的 for 循环内创建新的数组文字是否会占用大量资源？

Question

我一直有这个疑问。如果我在函数中创建数组文字并返回它，并在 for 循环中使用此函数，它会使用很多资源吗？

例如，我有:

function getArray(in) {
  const array = [];
  in.forEach(element => {
      if (element.value === 'hello') {
        array.push(element);
      }
  });
  return array;
}

for (const value of outerArray) {
  const array = getArray(value.nestedArray);
  array.forEach(element => { console.log('world'); });
}

此处，outerArray 包含一组值。每个值都有一个nestedArray。在此示例中，我在循环内创建一个新的数组文字。假设 outerArray 有 9999 个值，并且我每秒使用此循环 10 次。这会使用大量的内存吗？如果我在 outerArray 的值中创建一个新数组并直接在该函数中操作该数组会更好吗？像这样:

class Value {
  constructor() {
    ...
    this.displayArray = [];
  }
...
}

function getArray(value) {
  value.nestedArray.forEach(element => {
      if (element.value === 'hello') {
        value.displayArray.push(element);
      }
  });
  return array;
}

for (const value of outerArray) {
  getArray(value);
  value.displayArray.forEach(element => { console.log('world'); });
}

Answer 1

Does it use many resources if I create an array literal in a function and return it, and use this function in a for loop?

不，新数组应该定期进行垃圾收集。所以，是的，它当然确实使用了一些内存，但不是“疯狂的数量”。不过，“多”到底是多少、是否过多，还需要你去尝试。编写一个不创建数组的代码版本(如果可能的话)并分析它们的内存使用情况。

function forEachHello(arr) {
  for (const element of arr) {
    if (element.value === 'hello') {
      callback(element);
    }
  }
}

for (const value of outerArray) {
  forEachHello(value.nestedArray, element => { console.log('world'); });
}

Would it be better if I create a new array in the value of outerArray and directly manipulate the array in that function?

考虑到所有数组一直存在，这会使用更多的内存，但当然它给垃圾收集器带来的压力更小。当您不再需要数组的内容时，请确保清空数组。总体而言，它可能更有效，但找出答案的唯一方法是基准。