提高此方法的性能以展平阵列

Question

我正在开发一个大型 javascript 应用程序，不出所料，它在 IE11 中确实很困难（Chrome = 8 秒，nodejs= 8 秒，IE11 = 35 秒）。

所以我做了一些分析，发现这个方法是我的时间槽。我已经完成了我能想到的所有更改 - 是否还有其他可以改进的性能改进？

const flatten = function(arr, result) {
  if (!Array.isArray(arr)) {
    return [arr];
  }

  if(!result){
    result = [];
  }

  for (let i = 0, length = arr.length; i < length; i++) {
      const value = arr[i];
      if (Array.isArray(value)) {
        flatten(value, result);
      } 
      else {
        result.push(value);
      }
  }

  return result;
  };

该方法被多次调用，数组较小（最多 10 个字符串项，深度不超过 2 级）。

Answer 1

应避免重复执行if (!result) 和Array.isArray(value) 检查。我会去的

function flatten(arr, result = []) {
  if (Array.isArray(arr)) {
    for (var i = 0; i < arr.length; i++) {
      flatten(arr[i], result);
    }
  } else {
    result.push(arr);
  }
  return result;
}

为了简单起见，如果编译器没有通过内联和识别循环模式来优化这一点，我也会尝试

function flatten(val) {
  if (Array.isArray(val)) // omit this check if you know that `flatten` is called with arrays only
    return flattenOnto(val, []);
  else
    return [val];
}
function flattenOnto(arr, result) {
  for (var i = 0, len = arr.length; i < len; i++) {
    var val = arr[i];
    if (Array.isArray(val))
      flattenOnto(val, result);
    else
      result.push(val);
  }
  return result;
}

我也使用普通的var 而不是let，因为it had been known to be faster，不知道现在是否改变了。

如您所说，如果您也知道数组的深度有限，您甚至可能想尝试内联递归调用并将其拼写为

function flatten(val) {
  if (!Array.isArray(val)) return [val]; // omit this check if you can
  var result = [];
  for (var i = 0, ilen = arr.length; i < ilen; i++) {
    var val = arr[i];
    if (Array.isArray(val)) {
      for (var j = 0, jlen = val.length; j < jlen; j++) {
        // as deep as you need it
        result.push(val[j]);
      }
    } else {
      result.push(val);
    }
  }
  return result;
}

Answer 2

你使用递归的方式对我来说有点奇怪：你既要返回数组又要根据深度级别改变参数。您还重复了Array.isArray(array) 呼叫。我认为这段代码可以非常简化，例如如下（你可以看到没有参数突变）：

const flatten = (array) => Array.isArray(array)
  ? array.reduce((accumulated, value) => accumulated.concat(flatten(value)), [])
  : [array];

说实话，不确定性能会不会有那么大的提升，但在我看来它看起来更优雅 - jsPerf 是你的朋友！