优化：将多维数组拆分为子数组

Question

我有一个由以下格式组成的多维数组：

var source = [['Item 1', 10],['Item 2', 15],['Item 3', 50],['Item 4', 25]];

这由两个并行数据集组成：source[x][0] 是数据，source[x][1] 是应用于每个数据项的权重。我发现自己需要将其拆分为组件数组、数据和权重。我可以（并且目前）通过以下方式执行此操作：

var weighting = [], data = [];
for (var index = 0; index < source.length; index++)
{
    data.push(source[index][0]);
    weighting.push(source[index][1]);
}

这导致我有以下两个数组（继续前面的示例）：

var data = ['Item 1', 'Item 2', 'Item 3', 'Item 4'];
var weighting = [10, 15, 50, 25];

有没有更快的方法来做到这一点？我正在使用的源数组包含大约 200 万组数据和权重，因此与一次将这些分开一个条目的循环相比，成本更低的方法可以显着节省 CPU 时间。

Answer 1

这是一个代码审查问题，因为此解决方案可以正常运行。您最感兴趣的是性能。

现在，for 循环通常会胜过任何其他解决方案。但是，您可以稍微提高性能。

• 在循环中缓存数组的长度变量，避免不断检查长度。
• 在循环中检索索引对，而不是引用它两次。

这是一个例子：

var source = [
  ['Item 1', 10],
  ['Item 2', 15],
  ['Item 3', 50],
  ['Item 4', 25]
];

var data = [],
  weightings = [];

for (var i = 0, l = source.length; i < l; i++) {
  var item = source[i];
  data.push(item[0]);
  weightings.push(item[1])
}

console.log(data);
console.log(weightings);

根据for 循环中的示例，我们将l 的值分配给数组的长度。现在，var i = 0, l = source.length; 在循环期间有效地缓存了它。

接下来，我们在循环 var item = source[i]; 中检索索引对（数组），因此我们不必在数组中定位它两次。

这可以在jsPerf: Reduce vs. Loop 12 上测试。

现在实际上有 2,000,000 条记录，原始方法不需要太多时间（在我的测试机器上大约需要 100 毫秒）。

这是一个测试示例，检查控制台时间非常接近。

JSFiddle

绩效考核

机器（i7 5820k 64 GB DDR4 RAM）： 请注意，出于兴趣，我已经更新了小提琴以包含 while 版本。

Old Version took 83.56999999999994 ms
Perf Version took 44.24500000000012 ms
While took 76.2800000000002 ms

对我来说，这是一个 ~45% 的增长，是的，这只是时间上的微小差异。

Answer 2

此函数只查看数组中的每个项目并将各个属性推送到新数组中。底部的两个循环不是必需的。我把它们放在那里查看结果。

var source = [['Item 1', 10],['Item 2', 15],['Item 3', 50],['Item 4', 25]];
var arr1 = [];
var arr2 = [];

splitArray();

function splitArray() {
  for (var i = 0; i < source.length; i++) {
    var item = source[i];
    arr1.push(item[0]);
    arr2.push(item[1]);
  }

  for(var j = 0; j < arr1.length; j++) {
    console.log(arr1[j]);
  }

  for(var k = 0; k < arr1.length; k++) {
    console.log(arr2[k]);
  }
}