表JS中的数组数据

Question

我想获取两个数组collected = [1, 0, 2,]和teacher = ['Zimmerman', 'Tischler', 'Johnson']的内容，并使用sort()方法在表中显示这些数组。所以这看起来像这样：
约翰逊 - 2
齐默尔曼 - 1
Tischler - 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作为演示文稿。一个合适的方法：

＆＃13;

＆＃13;

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

＆＃13;

＆＃13;

＆＃13;