不想循环里面套循环，帮我看看怎么分开来解决

Question

假如一个object
rows":[{"id":"32","name":"nam3e1","age":1},{"id":"32","name":"ana2me1","age":2},{"id":"32","name":"b3name1","age":1},{"id":"32","name":"cna3me1","age":3}]}然后在一个table里面<table height="33" border="0" cellpadding="0" cellspacing="0">
      <tr class="rr0">
      <td class="row0">id</row>
      <td class="row1">name</row>
      <td class="row2">age</row>
      </tr>
      <tr class="rr1">
      <td class="row0">id</row>
      <td class="row1">name</row>
      <td class="row2">age</row>
      </tr>
一般的思维，是先FOR循环一下object，然后在循环一下每个组
这样的话，就会FOR 套 FOR请问有没有办法拆分开来

Answer 1

这样可以不？var obj = {"rows":[{"id":"32","name":"nam3e1","age":1},{"id":"32","name":"ana2me1","age":2},{"id":"32","name":"b3name1","age":1},{"id":"32","name":"cna3me1","age":3}]};
var html = '<table height="33" border="0" cellpadding="0" cellspacing="0">';
for(var i in obj.rows){
    html+='<tr class="rr'+i+'">\
                <td class="row0">'+obj.rows[i].id+'</row>\
                <td class="row1">'+obj.rows[i].name+'</row>\
                <td class="row2">'+obj.rows[i].age+'</row>\
           </tr>';
}
    html+='</table>';
    console.log(html)

Answer 2

<table>
<tr>
<td>id</td>
<td>name</td>
<td>age</td>
</tr>
<tbody id="tbodyContent"></tbody>
</table>var json=$.parseJSON(object);
var data=json.rows;
$.each(data, function (i,n) {
     var tr="<tr><td>"+n.id+"</td>"
            +"<td>"+n.name+"</td>"
            +"<td>"+n.age+"</td>"
            +"</tr>";
     $("#tbodyContent").append(tr);
});

Answer 3

这个嵌套循环是难免的..除非就是他们写的..第二层循环.你省略了..手动写好3个td
在或者弄个each方法来遍历..但最终原理还是嵌套循环..看着好看点吧..
推荐使用数组的forEach方法来遍历吧.这个是JS 1.6定义的规范.有些浏览器已经实现了.没实现的用下面的方法代替if ( !Array.prototype.forEach ) {
  Array.prototype.forEach = function(fn, scope) {
    for(var i = 0, len = this.length; i < len; ++i) {
      fn.call(scope, this[i], i, this);
    }
  }
}参考网址https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Array/forEach

Answer 4

回1-2楼  <td class="row0">id</row>
      <td class="row1">name</row>
      <td class="row2">age</row>  里面的td是不固定的，可能很多

Answer 5

你是为了代码结构考虑还是什么？把 列和行的输出分开如何？function writeTable(){    for(var i=0;i<rows.length;i++)
    {
        write1Row(rows[i]);
    }
}function write1Row(o){
    for each ...{
    }
}

Answer 6

foreach(row in table){
    renderer(row)
}这个逻辑不可避免

Answer 7

var se = "32,mnam3e1,9|34,ngfssfe1,2|33,ngdddd,7|38,n655dd,3";
var as = se.replace(/([^\|,]+),?/g,"<td>$1</td>");
as = "<table><tr>"+as.replace(/\|/g,"</tr><tr>")+"</tr></table>";
document.write(as);
alert(as);

Answer 8

首先你的数据量有多少？ 1W行？ 10w行？ 有这个数据量 那么 你需要优化的就不是渲染代码了
要相信 计算机的能力另外所谓的双循环  其实只是 一次迭代
也就是 枚举每个 obj
剩余的对每个obj的处理  还需要枚举吗？ 那些key不都是固定的 直接引用就可以了