Javascript 集合与数组性能

Question

这可能是因为 Sets 对于 Javascript 来说相对较新，但我一直无法在 StackO 或其他任何地方找到一篇文章来讨论这两者在 Javascript 中的性能差异。那么，就性能而言，两者之间有何区别？具体来说，当涉及到删除、添加和迭代时。

Answer 1

好的，我已经测试了从数组和集合中添加、迭代和删除元素。我运行了一个“小”测试，使用 10 000 个元素和一个“大”测试，使用 100 000 个元素。这是结果。

向集合中添加元素

似乎 .push 数组方法比 .add set 方法快大约 4 倍，无论添加的元素数量如何。

遍历和修改集合中的元素

对于这部分测试，我使用了 for 循环来遍历数组，并使用 for of 循环来遍历集合。同样，遍历数组更快。这一次它似乎呈指数增长，因为在“小”测试期间花费的时间是它的两倍，而在“大”测试期间花费的时间几乎是它的四倍。

从集合中移除元素

这就是有趣的地方。我结合使用了 for 循环和 .splice 从数组中删除一些元素，我使用了 for of 和 .delete 从集合中删除一些元素。对于“小型”测试，从集合中删除项目的速度大约快三倍(2.6 毫秒对 7.1 毫秒)，但对于“大型”测试，情况发生了巨大变化，从数组中删除项目需要 1955.1 毫秒，而它只将它们从集合中移除需要 83.6 毫秒，快了 23 倍。

结论

在 10k 个元素时，两个测试的运行时间相当(数组:16.6 毫秒，集合:20.7 毫秒)，但是当处理 100k 个元素时，集合是明显的赢家(数组:1974.8 毫秒，集合:83.6 毫秒)但这只是因为的删除操作。否则数组更快。我不能确切地说出这是为什么。

我试过一些混合场景，在这些场景中，创建并填充了一个数组，然后将其转换为一个集合，其中一些元素将被删除，然后该集合将重新转换为一个数组。虽然这样做会比删除数组中的元素提供更好的性能，但传输到集合和从集合传输所需的额外处理时间超过了填充数组而不是集合的 yield 。最后，只处理一组会更快。不过，这是一个有趣的想法，如果选择使用数组作为一些没有重复项的大数据的数据集合，那么如果需要删除一个数组中的许多元素，那么它在性能方面可能是有利的操作，将数组转换为集合，执行删除操作，并将集合转换回数组。

数组代码:

var timer = function(name) {
  var start = new Date();
  return {
    stop: function() {
      var end = new Date();
      var time = end.getTime() - start.getTime();
      console.log('Timer:', name, 'finished in', time, 'ms');
    }
  }
};

var getRandom = function(min, max) {
  return Math.random() * (max - min) + min;
};

var lastNames = ['SMITH', 'JOHNSON', 'WILLIAMS', 'JONES', 'BROWN', 'DAVIS', 'MILLER', 'WILSON', 'MOORE', 'TAYLOR', 'ANDERSON', 'THOMAS'];

var genLastName = function() {
  var index = Math.round(getRandom(0, lastNames.length - 1));
  return lastNames[index];
};

var sex = ["Male", "Female"];

var genSex = function() {
  var index = Math.round(getRandom(0, sex.length - 1));
  return sex[index];
};

var Person = function() {
  this.name = genLastName();
  this.age = Math.round(getRandom(0, 100))
  this.sex = "Male"
};

var genPersons = function() {
  for (var i = 0; i < 100000; i++)
    personArray.push(new Person());
};

var changeSex = function() {
  for (var i = 0; i < personArray.length; i++) {
    personArray[i].sex = genSex();
  }
};

var deleteMale = function() {
  for (var i = 0; i < personArray.length; i++) {
    if (personArray[i].sex === "Male") {
      personArray.splice(i, 1)
      i--
    }
  }
};

var t = timer("Array");

var personArray = [];

genPersons();

changeSex();

deleteMale();

t.stop();

console.log("Done! There are " + personArray.length + " persons.")

设置代码:

var timer = function(name) {
    var start = new Date();
    return {
        stop: function() {
            var end  = new Date();
            var time = end.getTime() - start.getTime();
            console.log('Timer:', name, 'finished in', time, 'ms');
        }
    }
};

var getRandom = function (min, max) {
  return Math.random() * (max - min) + min;
};

var lastNames = ['SMITH','JOHNSON','WILLIAMS','JONES','BROWN','DAVIS','MILLER','WILSON','MOORE','TAYLOR','ANDERSON','THOMAS'];

var genLastName = function() {
    var index = Math.round(getRandom(0, lastNames.length - 1));
    return lastNames[index];
};

var sex = ["Male", "Female"];

var genSex = function() {
    var index = Math.round(getRandom(0, sex.length - 1));
    return sex[index];
};

var Person = function() {
	this.name = genLastName();
	this.age = Math.round(getRandom(0,100))
	this.sex = "Male"
};

var genPersons = function() {
for (var i = 0; i < 100000; i++)
	personSet.add(new Person());
};

var changeSex = function() {
	for (var key of personSet) {
		key.sex = genSex();
	}
};

var deleteMale = function() {
	for (var key of personSet) {
		if (key.sex === "Male") {
			personSet.delete(key)
		}
	}
};

var t = timer("Set");

var personSet = new Set();

genPersons();

changeSex();

deleteMale();

t.stop();

console.log("Done! There are " + personSet.size + " persons.")