Question

我有两个数组，如下所示。第一个数组只重复包含2个字段电子邮件ID，地址。

arr1 = [
  " Email ID: md@floretmedia.com",
  "# 361, 7TH CROSS, 1ST BLOCK JAYANAGAR, BANGALORE KA 560011 IN",
  " Email ID: santhosh@thidff.com",
  "# 46/4, Garvebhavi Playa kudul gate, Hossur Rd, Begur hobali bangalore Bangalore KA 560068 IN",
  " Email ID: rajiv.sawhney@flipkart.com",
  "Vaishnavi Summit, Ground Floor, 7th Main, 80 Feet Road, 3rd Block, Koramangala Industrial Layout, Bangalore KA 560034 IN", " Email ID: sachinjain@justdial.com",
  "PALM COURT BLDG.- M, 501/B, 5TH FL, NEW LINK RD. BESIDE GOREGAON SPORTS COMPLEX MALAD WEST MH 400064 IN", " Email ID: -", "MALANCHA ROAD KHARAGPUR MIDNAPUR WB 000000 IN"
];

我的第二个数组包含三个字段， ID，名称，日期，如下所示：

arr2 = [
  "05141859", " MURUGESAN DHANAPAL", "22 December 2011",
  "06372276", " RAJESWARI GOMATHINAYAGAM", "04 December 2012",
  "01815226", " RAJIV SAWHNEY", "11 April 2016",
  "00202052", " VENKATACHALAM STHANU SUBRAMANI", "05 December 2006"
];

我想要的输出是：

<tr>
  <th>Id</th>
  <th> Name</th>
  <th>date</th>
  <th>Email Id</th>Address
  <th></th>
</tr>'

我正在使用此代码：

$.each(arr1, function(i) {
  content += '<tr><td>' + arr[i % 2] + '</td><td>' + arr[i + 1] + '</td><td>' + arr[i + 2] + '</td>';
  return false;
});

$.each(cont, function(i) {
  content += '<td>' + cont[i % 2] + '</td><td>' + cont[i % 2 + 1] + '</td></tr>';

  return false;
});

Answer 1

这是一个解决方案。

var arr1 = [
  " Email ID: md@floretmedia.com",
  "# 361, 7TH CROSS, 1ST BLOCK JAYANAGAR, BANGALORE KA 560011 IN",
  " Email ID: santhosh@thidff.com",
  "# 46/4, Garvebhavi Playa kudul gate, Hossur Rd, Begur hobali bangalore Bangalore KA 560068 IN",
  " Email ID: rajiv.sawhney@flipkart.com",
  "Vaishnavi Summit, Ground Floor, 7th Main, 80 Feet Road, 3rd Block, Koramangala Industrial Layout, Bangalore KA 560034 IN", " Email ID: sachinjain@justdial.com",
  "PALM COURT BLDG.- M, 501/B, 5TH FL, NEW LINK RD. BESIDE GOREGAON SPORTS COMPLEX MALAD WEST MH 400064 IN", " Email ID: -", "MALANCHA ROAD KHARAGPUR MIDNAPUR WB 000000 IN"
];

var arr2 = [
  "05141859", " MURUGESAN DHANAPAL", "22 December 2011",
  "06372276", " RAJESWARI GOMATHINAYAGAM", "04 December 2012",
  "01815226", " RAJIV SAWHNEY", "11 April 2016",
  "00202052", " VENKATACHALAM STHANU SUBRAMANI", "05 December 2006"
];

var count = arr2.length;
var j = 0;

for (i = 0; i < count; i = i + 3) {
  $('#print tr:last').after('<tr><td>' + arr2[i] + '</td><td>' + arr2[i + 1] + '</td><td>' + arr2[i + 2] + '</td><td>' + arr1[j] + '</td><td>' + arr1[j + 1] + '</td></tr>');
  j = j + 2;
}

table {
  border-collapse: collapse;
}
td,
th {
  border: 1px solid grey;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<table id="print">
  <tr>
    <th>Id</th>
    <th>Name</th>
    <th>Date</th>
    <th>Email Id</th>
    <th>Address</th>
  </tr>
</table>

Answer 2

在此处运行：http://www.es6fiddle.net/is65fafa/

确认您的数据格式不是很好。但有时候我们无法控制它。如果你想对这些数据做更多的事情，建议反对它。但如果这是一次性使用：

let s = arr2.filter((e,i) => i%3 === 0).map((e,i) =>
  `<tr>
    <td>${arr2[i*3]}</td>
    <td>${arr2[i*3+1]}</td>
    <td>${arr2[i*3+2]}</td>
    <td>${arr1[i*2]}</td>
    <td>${arr1[i*2+1]}</td>
   </tr>` ).join('')

Answer 3

让我先说一下，解决这个问题的最佳方法应该是首先改善数据的结构，但如果不可能，请尝试以下方法：

var i = 0;
var $table = $("<table>");
while (2 * i < arr1.length && 3 * i < arr2.length) {
  $("<tr>").append($("<td>").text(arr1[2 * i])).append($("<td>").text(arr1[2 * i + 1])).append($("<td>").text(arr2[3 * i])).append($("<td>").text(arr2[3 * i + 1])).append($("<td>").text(arr2[3 * i + 2])).appendTo($table);
  i++;
}
$table.appendTo("#tableHolder");

Link

Answer 4

我首先转换为一个对象数组。我在这里称他们为records。

interface Record {
  id:      string;
  name:    string;
  date:    string;
  emailId: string;
  address: string;
}

这会迭代数组中step项的组。每次调用它都会返回下一个step项。当没有更多项目时，它会返回null。

function makeGroupIterator(array, step) {
  var index = 0;
  return function () {
    if (index + step >= array.length) {
      return null;
    }
    var group = array.slice(index, index + step);
    index += step;
    return group;
  };
}

这将获取两个数组并将它们转换为记录结构。

function convertToRecords(arr1, arr2) {

  var records = [];

  var nextArr1Group = makeGroupIterator(arr1, 2);
  var nextArr2Group = makeGroupIterator(arr2, 3);

  while (true) {

    var group1 = nextArr1Group();
    var group2 = nextArr2Group();
    if (!group1 || !group2) {
      break;
    }

    records.push({
      id:      group2[0],
      name:    group2[1],
      date:    group2[2],
      emailId: group1[0],
      address: group1[1]
    });
  }
  return records;
}

这将获取记录数组并将其转换为html字符串。

function formatRecords(records) {
  var content = "";
  for (var i = 0; i < records.length; i++) {
    var r = records[i];
    content += [
      "<tr>",
        "<td>", r.id ,     "</th>",
        "<td>", r.name,    "</td>",
        "<td>", r.date,    "</td>",
        "<td>", r.emailId, "</td>",
        "<td>", r.address, "</td>",
      "</tr>"
    ].join("");
  }
  return content;
}

用法示例：

var arr1 = [
  " Email ID: md@floretmedia.com",
  "# 361, 7TH CROSS, 1ST BLOCK JAYANAGAR, BANGALORE KA 560011 IN",
  " Email ID: santhosh@thidff.com",
  "# 46/4, Garvebhavi Playa kudul gate, Hossur Rd, Begur hobali bangalore Bangalore KA 560068 IN",
  " Email ID: rajiv.sawhney@flipkart.com",
  "Vaishnavi Summit, Ground Floor, 7th Main, 80 Feet Road, 3rd Block, Koramangala Industrial Layout, Bangalore KA 560034 IN", " Email ID: sachinjain@justdial.com",
  "PALM COURT BLDG.- M, 501/B, 5TH FL, NEW LINK RD. BESIDE GOREGAON SPORTS COMPLEX MALAD WEST MH 400064 IN", " Email ID: -", "MALANCHA ROAD KHARAGPUR MIDNAPUR WB 000000 IN"
];

var arr2 = [
  "05141859", " MURUGESAN DHANAPAL", "22 December 2011",
  "06372276", " RAJESWARI GOMATHINAYAGAM", "04 December 2012",
  "01815226", " RAJIV SAWHNEY", "11 April 2016",
  "00202052", " VENKATACHALAM STHANU SUBRAMANI", "05 December 2006"
];

var records = convertToRecords(arr1, arr2);
var html = formatRecords(records);
console.log(html)

Answer 5

好吧，让我不仅给你标题，还给整个表格。我使用泛型函数tableMaker来获取表HTML。它需要一组对象。每个对象代表一行，而属性在标题中是显而易见的。 tableMaker接受两个参数，如tableMaker(tableData,true)，如果第二个参数为true，则显示标题，否则不显示。

＆＃13;

function tableMaker(o,h){
  var keys = Object.keys(o[0]),
  rowMaker = (a,t) => a.reduce((p,c,i,a) => p + (i === a.length-1 ? "<" + t + ">" + c + "</" + t + "></tr>"
                                                                  : "<" + t + ">" + c + "</" + t + ">"),"<tr>"),
      rows = o.reduce((r,c) => r + rowMaker(keys.reduce((v,k) => v.concat(c[k]),[]),"td"),h ? rowMaker(keys,"th") : []);
  return "<table>" + rows + "</table>";
}

var data1 = [" Email ID: md@floretmedia.com","# 361, 7TH CROSS, 1ST BLOCK JAYANAGAR, BANGALORE KA 560011 IN",
              " Email ID: santhosh@thidff.com", "# 46/4, Garvebhavi Playa kudul gate, Hossur Rd, Begur hobali bangalore Bangalore KA 560068 IN",
              " Email ID: rajiv.sawhney@flipkart.com","Vaishnavi Summit, Ground Floor, 7th Main, 80 Feet Road, 3rd Block, Koramangala Industrial Layout, Bangalore KA 560034 IN",
              " Email ID: sachinjain@justdial.com","PALM COURT BLDG.- M, 501/B, 5TH FL, NEW LINK RD. BESIDE GOREGAON SPORTS COMPLEX MALAD WEST MH 400064 IN",
              " Email ID: -", "MALANCHA ROAD KHARAGPUR MIDNAPUR WB 000000 IN"
            ].reduce((data,e,i) => !(i%2) ? data.concat({"Email ID": e.split(":")[1].trim()})
                                          : (data[data.length-1].Address = e, data) ,[]),
    data2 = ["05141859", " MURUGESAN DHANAPAL", "22 December 2011",
             "06372276", " RAJESWARI GOMATHINAYAGAM", "04 December 2012",
             "01815226", " RAJIV SAWHNEY", "11 April 2016",
             "00202052", " VENKATACHALAM STHANU SUBRAMANI", "05 December 2006"
            ].reduce((data,e,i) => i%3 === 0 ? data.concat({"Id": e})
                                             : i%3 === 1 ? (data[data.length-1].Name = e.trim(), data)
                                                         : (data[data.length-1].Date = e, data),[]),
tableData = data2.map((o,i) => Object.assign({},o,data1[i])),
tableHTML = tableMaker(tableData,true);
myTable.innerHTML = tableHTML;

＆＃13;

<div id="myTable"></div>

＆＃13;

如何以正确的格式打印2个数组中的值

5 个答案: