Does JavaScript have a built in stringbuilder class?
JavascriptStringbuilderJavascript Problem Overview
I see a few code project solutions.
But is there a regular implementation in JavaScript?
Javascript Solutions
Solution 1 - Javascript
If you have to write code for Internet Explorer make sure you chose an implementation, which uses array joins. Concatenating strings with the + or += operator are extremely slow on IE. This is especially true for IE6. On modern browsers += is usually just as fast as array joins.
When I have to do lots of string concatenations I usually fill an array and don't use a string builder class:
var html = [];
html.push(
"<html>",
"<body>",
"bla bla bla",
"</body>",
"</html>"
);
return html.join("");
Note that the push methods accepts multiple arguments.
Solution 2 - Javascript
I just rechecked the performance on http://jsperf.com/javascript-concat-vs-join/2. The test-cases concatenate or join the alphabet 1,000 times.
In current browsers (FF, Opera, IE11, Chrome), "concat" is about 4-10 times faster than "join".
In IE8, both return about equal results.
In IE7, "join" is about 100 times faster unfortunately.
Solution 3 - Javascript
No, there is no built-in support for building strings. You have to use concatenation instead.
You can, of course, make an array of different parts of your string and then call join() on that array, but it then depends on how the join is implemented in the JavaScript interpreter you are using.
I made an experiment to compare the speed of str1+str2 method versus array.push(str1, str2).join() method. The code was simple:
var iIterations =800000;
var d1 = (new Date()).valueOf();
str1 = "";
for (var i = 0; i<iIterations; i++)
str1 = str1 + Math.random().toString();
var d2 = (new Date()).valueOf();
log("Time (strings): " + (d2-d1));
var d3 = (new Date()).valueOf();
arr1 = [];
for (var i = 0; i<iIterations; i++)
arr1.push(Math.random().toString());
var str2 = arr1.join("");
var d4 = (new Date()).valueOf();
log("Time (arrays): " + (d4-d3));
I tested it in Internet Explorer 8 and Firefox 3.5.5, both on a Windows 7 x64.
In the beginning I tested on small number of iterations (some hundred, some thousand items). The results were unpredictable (sometimes string concatenation took 0 milliseconds, sometimes it took 16 milliseconds, the same for array joining).
When I increased the count to 50,000, the results were different in different browsers - in Internet Explorer the string concatenation was faster (94 milliseconds) and join was slower(125 milliseconds), while in Firefox the array join was faster (113 milliseconds) than string joining (117 milliseconds).
Then I increased the count to 500'000. Now the array.join() was slower than string concatenation in both browsers: string concatenation was 937 ms in Internet Explorer, 1155 ms in Firefox, array join 1265 in Internet Explorer, and 1207 ms in Firefox.
The maximum iteration count I could test in Internet Explorer without having "the script is taking too long to execute" was 850,000. Then Internet Explorer was 1593 for string concatenation and 2046 for array join, and Firefox had 2101 for string concatenation and 2249 for array join.
Results - if the number of iterations is small, you can try to use array.join(), as it might be faster in Firefox. When the number increases, the string1+string2 method is faster.
UPDATE
I performed the test on Internet Explorer 6 (Windows XP). The process stopped to respond immediately and never ended, if I tried the test on more than 100,000 iterations. On 40,000 iterations the results were
Time (strings): 59175 ms
Time (arrays): 220 ms
This means - if you need to support Internet Explorer 6, choose array.join() which is way faster than string concatenation.
Solution 4 - Javascript
That code looks like the route you want to take with a few changes.
You'll want to change the append method to look like this. I've changed it to accept the number 0, and to make it return this so you can chain your appends.
StringBuilder.prototype.append = function (value) {
if (value || value === 0) {
this.strings.push(value);
}
return this;
}
Solution 5 - Javascript
EDIT
No, there is not a built-in class. However, string literals may be a suitable work-around.
ORIGINAL ANSWER
The ECMAScript 6 version (aka ECMAScript 2015) of JavaScript introduced string literals.
var classType = "stringbuilder";
var q = `Does JavaScript have a built-in ${classType} class?`;
Notice that back-ticks, instead of single quotes, enclose the string.
Solution 6 - Javascript
I have defined this function:
function format() {
var args = arguments;
if (args.length <= 1) {
return args;
}
var result = args[0];
for (var i = 1; i < args.length; i++) {
result = result.replace(new RegExp("\\{" + (i - 1) + "\\}", "g"), args[i]);
}
return result;
}
And can be called like c#:
var text = format("hello {0}, your age is {1}.", "John", 29);
Result:
> hello John, your age is 29.
Solution 7 - Javascript
StringBuilder for JavaScript try this..
function StringBuilder(value) {
this.strings = new Array();
this.append(value);
}
StringBuilder.prototype.append = function (value) {
if (value) {
this.strings.push(value);
}
}
StringBuilder.prototype.clear = function () {
this.strings.length = 0;
}
StringBuilder.prototype.toString = function () {
return this.strings.join("");
}
var sb = new StringBuilder();
sb.append("This is");
sb.append("much better looking");
sb.append("than using +=");
var myString = sb.toString();
sb.clear();
Solution 8 - Javascript
For those interested, here's an alternative to invoking Array.join:
var arrayOfStrings = ['foo', 'bar'];
var result = String.concat.apply(null, arrayOfStrings);
console.log(result);
The output, as expected, is the string 'foobar'. In Firefox, this approach outperforms Array.join but is outperformed by + concatenation. Since String.concat requires each segment to be specified as a separate argument, the caller is limited by any argument count limit imposed by the executing JavaScript engine. Take a look at the documentation of Function.prototype.apply() for more information.
Solution 9 - Javascript
Here is a quick example of a StringBuilder class in Typescript:
export class StringBuilder {
private _lines: string[] = [];
write(line: string = ""): void {
this._lines.push(line);
}
writeln(line: string = ""): void {
this._lines.push(line);
this._lines.push("\n");
}
toString(): string {
return this._lines.join("");
}
}
You can use like the following:
const sb = new StringBuilder();
sb.write("Hello World");
sb.writeln("!");
console.log(sb.toString());
Solution 10 - Javascript
When I find myself doing a lot of string concatenation in JavaScript, I start looking for templating. Handlebars.js works quite well keeping the HTML and JavaScript more readable. http://handlebarsjs.com
Solution 11 - Javascript
In C# you can do something like
String.Format("hello {0}, your age is {1}.", "John", 29)
In JavaScript you could do something like
var x = "hello {0}, your age is {1}";
x = x.replace(/\{0\}/g, "John");
x = x.replace(/\{1\}/g, 29);
Solution 12 - Javascript
How about sys.StringBuilder() try the following article.