一道阿里笔试题

请把以下用于连接字符串的JavaScript代码修改为更高效的方式

var htmlString = ‘ < div class=”container” > ’ + ‘ < ul id=”news-list” > ’;
for (var i = 0; i < NEWS.length; i++) {
htmlString += ‘ < li > < a href=”’ +NEWS[i].LINK + ‘” > +NEWS[i].TITLE + ‘ < /a > < /li > ’;
}
htmlString += ‘ < /ul > < /div > ‘’

　　但是看到的时候感觉怪怪的，就是感觉顶多把news.length缓存下就ok了，原来在老式浏览器（ie6）里字符串“+”的效率很低，用join会好些。不过，现在应该不用考虑了吧，看下知乎上的答案：

考点有两个：

1. JavaScript的字符串连接机制。
2. NEWS.length需要缓存，不然每次循环都要重新计算一次length

===============
主要看一下第一个：
在js里字符串一旦赋值后不能修改。

基于这个背景看一下字符串连接操作：

var str ;
str = ‘this is a string‘;
str = str + ‘,another string.‘;

对于这个连接操作JS的处理机制是：新建一个临时字符串，将新字符串赋值为 str + ‘,another string.‘ ,然后返回这个新字符串并同时销毁原始字符串。所以字符串的连接效率较低。提高效率的办法是用数组的join函数

var tempArr = [] ,src,res;
src = ‘this is a string‘;
tempArr.push(src);
tempArr.push(‘,another string.‘);
res = tempArr.join(‘‘);

不过在《JavaScript高级程序设计》里也提到：

这个过程是在后台发生的，而这也是在某些旧版本的浏览器（例如版本低于1.0的FireFox、IE6等）中拼接字符串是速度很慢的原因。但这些浏览器后来的版本已经解决了这个问题。

所以效率提高也只是在IE6 等低版本的浏览器中有效。