Question

标题基本上。

我们正在谈论javascript，以明确这一点。我需要知道是否有任何性能上的负面影响，内存问题以及使用高值整数作为数组索引而不是低值整数。我知道某些编程语言会分配足够的内存来索引从0到最大值的所有元素与动态“魔法”数组或诸如此类的东西，所以我要问：

var arrayA = [];
arrayA[12526] = "a";
var arrayB = [];
arrayB[1] = "b";

arrayA和arrayB是否对系统造成了相同的压力，或者使用arrayB类结构的影响要小得多;

可选阅读:(我为何遇到此问题）

我想从某种意义上说，我想要的是动态CSS字符串。假设我的代码每隔几秒就生成一个dom元素（div）和一块CSS，它将所述div移动几秒钟。在5秒后，这个div永远被移除，永远不会被再次使用，所以CSS也需要去。

我发现，在创建div时，我还会通过var uniqueID = setTimeout创建超时，然后使用uniqueID的值命名css选择器。这允许我同时存在大量div，每个div将具有唯一ID，因为每个都附加有计时器。然后我创建一个样式字符串，例如#uniqueID {top: 20px; left: 20px;}，其中显然不同的div具有不同的属性。每次我创建其中一个CSS规则时，我都会更新<style>元素的innerHTML以在其中包含此附加规则。过了一会儿虽然我拥有的CSS字符串很大......我们说的是2000个独特的样式ID选择器，但实际上并没有使用它们。所以我想澄清一下。每当我添加一个新的CSS时，制作一个“重写”innerHTML元素<style>的对象，还记得我之前谈过的计时器吗？这是我从数组中删除样式字符串的地方。因此，随着时间的推移，只有屏幕上的divs会将其CSS存储在页面的<style>元素中。

这是代码：

var styleSystem = {
    repository: [],
    add: function (id, style) {
        this.repository[id] = style;
        this.updateStyle();
        console.log("added");
    },
    remove: function (id) {
        this.repository.splice(id, 1);
        this.updateStyle();
        console.log("removed");
    },
    updateStyle: function () {
        var summedString = "";
        this.repository.forEach(function (element) {
            summedString += element;
        });
        document.getElementById("DynamicStyle").innerHTML = summedString;
    }
};

请注意：
〜代码没有问题，它有效，我只是担心我性能不好，因为我使用高整数索引数组ID来保存这些数据.~

关于性能主题，每次添加和删除新的<style>元素到DOM树可能会更好，而不是动态地改变单个元素的内容强制CSS重绘，可能没有要重绘，只有5-10个ish div同时存在？

修改在进一步调查后，我注意到这不能按预期工作，有时会删除字符串，有时则不会。视觉上这个东西有效，但它仍然在CSS中保留某些字符串，这很糟糕。我正尽力避免delete array[key]，因为它会导致去优化......解决任何问题吗？

Answer 1

从我使用当前版本的Chrome（v54）进行测试并使用您的代码：

var arrayA = [];
arrayA[12526] = "a";
var arrayB = [];
arrayB[1] = "b";

尽管arrayA的长度为12527，但它只有一个项目。如果我使用forEach方法遍历arrayA中的项目，它只返回单个值＆＃34; a＆＃34;。因此，它没有占用任何额外的记忆。

同样重要的是要注意，数组可以用作字典，你可以在字符串之间放置字符串名称（或键），就像你的情况一样。

arrayA["foo"] = "bar";

使用高整数数组索引是否有任何负面影响？

1 个答案: