首页 > 试题广场 >

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

[问答题]

请把以下用于连接字符串的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>";

推荐

降龙十巴掌

解析：JavaScript赋值效率问题

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

发表于 2014-11-03 11:22:44 回复(7)

阿多

var htmlString=[];

htmlString.push('<div class="container">' + '<ul id="news-list">');

for(var i=0;i<NEWS.length;i++){

var news = NEWS[i];

htmlString.push('<li><a href="'+ news.LINK+'">'+ news.TITLE+'</a></li>');

}

htmlString=htmlString.join("");

发表于 2015-02-26 20:36:29 回复(2)

天心水面

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

var htmlString=[];

htmlString.push(‘ < div class=”container” > ’ + ‘ < ul id=”news-list” > ’);

for(var i = 0, len = NEWS.length; i < len; i++){

var news = NEWS[i];

htmlString.push('<li><a href="'+ news.LINK+'">'+ news.TITLE+'</a></li>');

}

htmlString=htmlString.join("");

编辑于 2016-09-20 13:04:13 回复(0)

牛客501870号

var htmlString=[];

htmlString.push("<div class=”container”>" + "<ul id=”news-list”>");

for(var i=0;i<NEWS.length;i++){

htmlString.push('<li><a href="'+NEWS.[i].LINK+'>'+NEWS[i].TITLE+'</a></li>';

}

htmlString=htmlString.join("");

发表于 2014-12-08 14:21:24 回复(0)

乐活persevere

  var htmlString = "<div
  class='container'>"+ "<ul id='news-list'>"; 

  for (var i =0, len = NEWS.length
  ; i < len; i++) 
  {

      var newsItem = NEWS[i]; 

      htmlString += "<li><a href=" + newsItem.LINK
  + ">"  

          + newsItem.TITLE  + "</a></li>"; 

  } 

  htmlString +="</ul></div>"; 

发表于 2017-07-06 14:12:09 回复(0)

赵曜

现代浏览器下＋＝和arr.push arr.join效率差不多

The truth is rather more complex. In all the most recent browsers, either method is fast and will complete within 80ms on a mid-range PC. Here are the results from my own completely unscientific benchmark tests:

Chrome 6.0: standard string appends are usually quicker than array joins, but both complete in less than 10ms.
Opera 10.6: again, standard appends are quicker, but the difference is marginal—often 15ms compared to 17ms for an array join.
Firefox 3.6: the browser normally takes around 30ms for either method. Array joins usually have the edge, but only by a few milliseconds.
IE 8.0: a standard append requires 30ms, whereas an array join is more than double—typically 70ms.
Safari 5.0.1: bizarrely, a standard append takes no more than 5ms but an array join is more than ten times slower at 55ms.

The latest JavaScript engines are optimized for string concatenation operators. Array joins remain fast, but are without a performance gain.

发表于 2016-05-15 00:09:35 回复(0)

牛客201982号

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

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('');

发表于 2016-01-25 16:49:30 回复(0)

钟山

建议将NEWS.length 放在一个变量中

发表于 2015-08-27 16:51:12 回复(0)

盖斯贝雷

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

发表于 2015-03-20 21:01:31 回复(0)

牛客224199号

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>";

发表于 2014-12-22 22:24:50 回复(0)

Discovery

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>";

发表于 2014-12-11 14:00:38 回复(0)

牛客352579号

发表于 2014-12-02 10:56:42 回复(0)

SLEBEE

var divObj = document.createElement('div');
var oul =document.createElement('ul');
var htmlString ='';
for (var i = 0; i < NEWS.length; i++) {
htmlString += '<li><a href="' + NEWS[i].LINK + '>' + NEWS[i].TITLE + '</a></li>';
}

divObj.className = 'container';
oul.id='news-list';
oul.innerHTML =htmlString;
divObj.appendChild(oul);

发表于 2014-11-07 15:05:20 回复(0)

oxyflour

var st = ['<div class="container">','<ul id="news-list">'];

for (var i = 0; i < NEWS.length; i ++) {

st.push('<li><a href="');

st.push(NEWS[i].LINK);

st.push('">');

st.push(NEWS[i].TITLE ) ;

st.push('</a></li>');

}

st.push('</ul></div>');

htmlString = st.join('');

发表于 2014-11-06 21:18:07 回复(0)

提交观点

问题信息

前端工程师阿里巴巴 Javascript 2011

来自：阿里巴巴2011前端工...

上传者：〆涐，帥気傑

难度：

14条回答 116收藏 10362浏览

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

问题信息

热门推荐

相关试题