构建此字符串的最快方法

Fastest way to build this string

本文关键字：方法 字符串 构建      更新时间：2023-09-26

假设我有一个对象数组，里面有html字符串（还有其他东西，但我特别关注每个对象的html属性。例如

var items = [{
    html: '<div>test</div>'
}, {
    html: '<div>test</div>'
}, {
    html: '<div>test</div>'
}];

我需要使用所有这些字符串来构建一个字符串，并且我需要它们的顺序与它们给我的顺序相同，所以一个反向while循环就结束了。

在构建html方面有什么比下面更快的吗？

var html = [];
for (var i = 0, itemLen = items.length; i < itemLen; i++) {
    html.push(items[i].html)
}
output.innerHTML = html.join('');

更快的是：

var html = '';
for (var i = 0, itemLen = items.length; i < itemLen; ++i)
    html += items[i].html;
output.innerHTML = html;

编辑：

这更快：

var html = '';
for (var i = 0, itemLen = items.length; i < itemLen; html += items[i++].html);

这比您的快得多

var html = '';
for (var i = 0, itemLen = items.length; i < itemLen; i++) {
    html += items[i].html;
}
output.innerHTML = html;

var html = '';
for (var i = 0, itemLen = items.length; i < itemLen; i++) {
    html += items[i].html;
}
output.innerHTML = html

简单地连接到一个字符串将比构建一个数组并内爆它更快，因为从技术上讲，这是对数据的双循环，而不是一次循环。

这也起到了作用：

var items = [
    {html: '<div>test</div>'},
    {html: '<div>test</div>'},
    {html: '<div>test</div>'}],
    newString = "";
items.forEach(function(item) {
    newString = newString + item.html;
});

演示。

警告这是一个解决方案，可能会导致很多问题。但它确实提供了一种相对快速的方式来做你想做的事。

var items = [{
    html: '<div>test</div>'
}, {
    html: '<div>test</div>'
}, {
    html: '<div>test</div>'
}];
Object.prototype.toString=function(){return this.html};
items.join('');

如果首先要控制添加到数组中的对象，那么您只能更改该对象的原型，这不会干扰全局对象。

相关文章：