时间戳

首页 > 解决方案 > 仅将数组长度限制为 2 个数据

javascript - 仅将数组长度限制为 2 个数据

问题描述

我目前正在制作一个配对系统。我的目标是仅将数组长度限制为 2 个数据。在我目前的工作中，当我添加另一个相同级别的数据时，它变成了 1 个数组中的 3 个数据（请参见图 1）。当 1 个数组中有 3 个数据时，将额外的 1 个数据发送到另一个数组，直到找到匹配的玩家。当玩家等级相同时匹配有效。我在下面提供了我的代码和屏幕截图。任何帮助将不胜感激。谢谢你。

在此处输入图像描述

const source = [{
    id: 1,
    name: 'player1',
    level: 1
  },
  {
    id: 2,
    name: 'player2',
    level: 1
  },
  {
    id: 3,
    name: 'player3',
    level: 2
  },
  {
    id: 4,
    name: 'player4',
    level: 2
  },
  {
    id: 5,
    name: 'player5',
    level: 1
  },
  {
    id: 6,
    name: 'player6',
    level: 3
  },
  {
    id: 7,
    name: 'player7',
    level: 3
  },



]
const combine = (source) => {
  return source.reduce((acc, curr) => {
    if (acc[curr.level])
      acc[curr.level].push(curr);
    else
      acc[curr.level] = [curr];
    return acc;
  }, {})
}
var result = combine(source)
var html = ""
var keys = Object.keys(result) //if there more then one keys i.e : 2..

for (var i = 0; i < keys.length; i++) {
  console.log("Keys " + keys[i])
  //loop through json array
  result[keys[i]].forEach(function(val, index) {
  //check if index value is `0`..change name. 
    var ids = index == 0 ? "id[]" : "idside[]"
    var name = index == 0 ? "name[]" : "nameside[]"
    var levels = index == 0 ? "level[]" : "levelside[]"
    html += `<input type="text" name="${ids}" value="${val.id}">
<input type="text" name="${name}" value="${val.name}">
<input type="text" name="${levels}" value="${val.level}">`
  })
}
document.getElementById("result").innerHTML = html //add html to div

console.log(result);
<div id="result">
</div>

标签： javascript

解决方案

您可以通过acc[curr.level].length > 1以下combine方法检查一个级别是否有两个以上的玩家，忽略：

  const source = [{
            id: 1,
            name: 'player1',
            level: 1
        },
        {
            id: 2,
            name: 'player2',
            level: 1
        },
        {
            id: 3,
            name: 'player3',
            level: 2
        },
        {
            id: 4,
            name: 'player4',
            level: 2
        },
        {
            id: 5,
            name: 'player5',
            level: 1
        },
        {
            id: 6,
            name: 'player6',
            level: 3
        },
        {
            id: 7,
            name: 'player7',
            level: 3
        },



        ]
        const combine = (source) => {
            return source.reduce((acc, curr) => {
                if (acc[curr.level] && acc[curr.level].length > 1)
                    return acc;
                if (acc[curr.level])
                    acc[curr.level].push(curr);
                else
                    acc[curr.level] = [curr];
                return acc;
            }, {})
        }
        var result = combine(source)
        var html = ""
        var keys = Object.keys(result) //if there more then one keys i.e : 2..

        for (var i = 0; i < keys.length; i++) {
            console.log("Keys " + keys[i])
            //loop through json array
            result[keys[i]].forEach(function (val, index) {
                //check if index value is `0`..change name.
                var ids = index == 0 ? "id[]" : "idside[]"
                var name = index == 0 ? "name[]" : "nameside[]"
                var levels = index == 0 ? "level[]" : "levelside[]"
                html += `<input type="text" name="${ids}" value="${val.id}">
            <input type="text" name="${name}" value="${val.name}">
            <input type="text" name="${levels}" value="${val.level}">`
            })
        }
        document.getElementById("result").innerHTML = html //add html to div

        console.log(result);
 <div id="result">
    </div>

推荐阅读