JavaScript in the string stitching detailed _javascript Tips

In a recent study of JavaScript advanced programming, there is a description of the character of a string, probably as follows: the strings in ECMAScript are immutable, that is to say, once a string is created, their value cannot be changed. To change the saved string for a variable, first destroy the original string, and then fill the variable with another string containing the new value, for example:

Copy Code code as follows:

var lang = "Java";
Lang = lang + "Script";

The process of implementing this is to create a new string that can hold 10 characters, then populate "Java" and "script" in this string, and the last step is to destroy the original string "Java" and "script", because these two strings are useless. However, in a lower version of the browser (such as IE6), string stitching speed is a process that consumes a lot of performance.

From this I think of Java, in the Java string mechanism and JS similar (that is, the creation can not be changed, to change can only destroy the original value), but Java has a stringbuffer solve the problem of string immutable, JS and no similar method. But we can simulate this buffer mechanism. The principle is to use an array of stitching, the source code is as follows:

Copy Code code as follows:

function StringBuffer () {
this.__strings__ = new Array ();
}
StringBuffer.prototype.append = function (str) {
This.__strings__.push (str);
return this; Convenient chain operation
}
StringBuffer.prototype.toString = function () {
Return This.__strings__.join ("");
}

* * Test/*
var buffer = new StringBuffer ();
Buffer.append ("Hello"). Append ("JavaScript");

var result = buffer.tostring ();
alert (result);

Ps:gist address is as follows: Https://gist.github.com/hehongwei44/fe71f10e4d2d9295aeab

The mechanism we have simulated, but this method and string concatenation performance on how much difference, we can test, the test code is as follows:

Copy Code code as follows:

var D1 = new Date ();
var str = "";
for (var i = 0; i < 10000; i++) {
STR + + "text";
}
var d2 = new Date ();
document.write ("Test one Cost:" + (D2.gettime ()-d1.gettime ())/1000 + "SEC" + "<br/>");

var obuffer = new StringBuffer ();
D3 = new Date ();
for (var i = 0; i < 10000; i++) {
Obuffer.append ("text");
}
var sresult = obuffer.tostring ();
D4 = new Date ();
document.write ("Test two costs:" + (D4.gettime ()-d3.gettime ())/1000 + "seconds");

Test results are as follows: (different environment, test results may be different):

1. In the case of a 1000-time base comparison, both executions are very fast (basically a few milliseconds) time-consuming, the latter being less than 10 milliseconds old.
2. In the case of a 10,000-time base, the results are similar to the above, but the former are more likely to be IE6.
3. In the case of 100,000 times, string stitching under the IE6, obviously spend more time, other browsers are not big, and some are shorter than stringbuffer.

Conclusion

1. In the case of the number of stitching words less than 1000 times, the bold use of the former, generally we also rarely encounter the number of splicing thousands of cases.
 2. Other browsers for stitching are no performance problems, mainly IE6, if the number of splicing tens of thousands or 100,000, it is recommended that the IE6 is a separate stringbuffer simulation.