JavaScript如何从API返回的用户列表中随机抽取指定数量的对象？

问题原因 #

你代码输出240条的核心原因是把8次随机打印的循环嵌套在了users.forEach遍历逻辑里，https://api.github.com/users接口默认单次返回30个用户数据，users.forEach会遍历30次，每次遍历都会执行8次打印逻辑，30×8刚好就是你看到的240条输出。

修复代码 #

只需要把循环逻辑移到users.forEach外面即可，如果你需要保证8个用户不重复，可以额外加去重判断，参考代码如下：

<script>
fetch('https://api.github.com/users').then(function(response) {
    return response.json();
}).then(function(users){
    document.write("Highlighred Github users")
    const pickedLogins = new Set()
    // 选够8个不重复的用户就停止
    while (pickedLogins.size < 8) {
        const randomUser = users[Math.floor(Math.random() * users.length)]
        pickedLogins.add(randomUser.login)
    }
    pickedLogins.forEach(login => {
        document.write('<br>')
        document.write(login)
    })
}).catch(err => console.error(err));
</script>

如果不需要去重，直接写8次循环也可以：

<script>
fetch('https://api.github.com/users').then(function(response) {
    return response.json();
}).then(function(users){
    document.write("Highlighred Github users")
    for (let i=0; i< 8; i++) {
        document.write('<br>')
        document.write(users[Math.floor(Math.random() *users.length)].login)
    }
}).catch(err => console.error(err));
</script>

内容的提问来源于stack exchange，提问作者Adam Gong