js如何通过堆栈表

Question

该数组如何表？ 通过堆栈，而不是循环！ 看起来像这样

var infos = {
  title: [{
    'field': 'fish',
    'label': 'fish'
  }, {
    'field': 'dog',
    'label': 'dog'
  }, {
    'field': "cat",
    'label': 'cat'
  }],
  datas: []
}

for (var i = 0; i < 10; i++) {
  infos.datas.push({
    fish: 3 * i,
    dog: 3 * i + 1,
    cat: 3 * i + 2
  })
}

Answer 1

Question was not clear But if i understand correctly it should be something like [this]

http://plnkr.co/edit/nC9PLMKb5fPw5rNOM8sD

Answer 2

您可以通过迭代拥有的标签和数据来生成表。

function getTable(object) {
    return [
        '<table>',
        '<tr>' + object.title.map(({ label }) => `<th>${label}</th>`).join('') + '</tr>',
        object.data
            .map(r => `<tr>${Object.values(r).map(v => `<td>${v}</td>`).join('')}</tr>`)
            .join(''),
        '</table>'
    ].join('');
}
var infos = { title: [{ field: 'fish', label: 'fish' }, { field: 'dog', label: 'dog'}, { field: 'cat', label: 'cat' }] };

infos.data = Array.from({ length: 10 }, (_, i) => Object.assign(...infos.title.map(({ field }, j, { length }) => ({ [field]: i * length + j }))));

console.log(infos);
document.body.innerHTML += getTable(infos);

Answer 3

  

非循环

是的，我们可以！

let infos = {
  title: [{
    'field': 'fish',
    'label': 'fish'
  }, {
    'field': 'dog',
    'label': 'dog'
  }, {
    'field': "cat",
    'label': 'cat'
  }],
  datas: []
}

/* using map() instead of for-loop */
infos.datas = Array(10)  // array of 10 elements
  .fill('')              // fill with anything
  .map((_, idx) => {     // for each element...
    return {             // ...generate desired object
      fish: 3 * idx,
      dog: 3 * idx + 1,
      cat: 3 * idx + 2
    }
  })

console.log(infos) // result same as before

希望这会有所帮助。 干杯，