表JS中的數組數據

Question

我想獲取兩個數組的內容，分別collected = [1, 0, 2,] teacher = ['Zimmerman', 'Tischler', 'Johnson'] collected = [1, 0, 2,]和teacher = ['Zimmerman', 'Tischler', 'Johnson']並使用sort()方法在表中顯示這些數組。 這樣看起來像這樣：
約翰遜-2
齊默爾曼-1
蒂施勒-0

有人知道該怎么做嗎？

Answer 1

您可以使用按collected排序並使用indexOf函數

請參閱工作示例：

 var collected = [1, 0, 2]; var teacher = ['Zimmerman', 'Tischler', 'Johnson']; var res = collected.slice().sort((a, b) => b - a) .map(e => `<tr><td>${teacher[collected.indexOf(e)]}</td> <td>${e}</td></tr>`).join(''); document.write('<table>' + res + '</table>' ); 

Answer 2

完整的例子：

<table id="tab" border="1">

</table>
<script type="text/javascript">

    var
        collected,
        teacher,
        table,
        data = '',
        source = [];

    collected = [1, 0, 2,];
    teacher = ['Zimmerman', 'Tischler', 'Johnson'];

    for (var i in collected) {

        source.push([collected[i], teacher[i]]);
    }

    source.sort(function(a, b) {

      return a[0] < b[0];
    });

    table = document.getElementById('tab');

    for (var i in source) {

        data += '<tr><td>' + source[i][0] + '</td><td>' + source[i][1] + '</td></tr>';
    }

    table.innerHTML = data;

</script>

結果：

Answer 3

您可以對索引進行排序，並將該數組用於以后的內容組裝。

 var collected = [1, 0, 2, ], teacher = ['Zimmerman', 'Tischler', 'Johnson'], cIndices = collected.map(function (_, i) { return i; }), table = document.createElement('table'); cIndices.sort(function (a, b) { return collected[b] - collected[a]; }); cIndices.forEach(function (a) { function getTD(s) { var td = document.createElement('td'); td.innerHTML = s; return td; } var tr = document.createElement('tr'); tr.appendChild(getTD(teacher[a])); tr.appendChild(getTD(collected[a])); table.appendChild(tr); }); document.body.appendChild(table); 

Answer 4

將result用於業務邏輯，並將html用於演示。 適當的方法：

 var collected = [1, 0, 2], teacher = ['Zimmerman', 'Tischler', 'Johnson'], result = {}, html = ''; // business logic collected.forEach(function (e, i) { result[e] = teacher[i]; }); // presentation Object.keys(result) .sort() .reverse() .forEach(function (e) { html += '<tr><td>' + result[e] + '</td>'; html += '<td>' + e + '</td></tr>'; }); document.write('<table>' + html + '</table>');