Можете ли вы динамически ставить в очередь и снимать с состояния React?

Question

Я пытаюсь создать объект для игроков с моим состоянием реакции. Я хочу делать это динамически, поэтому мне не нужно жестко задавать количество игроков, способных играть. Есть ли способ добиться этого изменения состояния с помощью очереди JS FIFO?

В моем случае я пытаюсь построить очередь игроков и вывести из очереди каждого игрока в состоянии после его хода. Игрокам понадобится возможность ставить в очередь на задний план, если они наберут правильный счет.

Я не уверен, смогу ли я использовать функцию, такую ​​как dequeue(), в setState? Если я не могу сделать это, я бы просто создал свой объект очереди перед установкой состояния, а затем передал бы этот результат в мой setState?

Кроме того, я не знаю, позволяет ли состояние React динамически изменять объект состояния компонента? Если бы у меня была очередь из нескольких игроков в штате, как:

playerQueue = {
   1: {
        id: 123,
        score: 5,
        queued: false,
        currentTurn: false
        },
   2: {
        id: 237,
        score: 7,
        queued: true,
        currentTurn: false
      },
   3: {
        id: 488,
        score: null,
        queued: true,
        currentTurn, true
      }

Позволяет ли мне состояние динамически добавлять столько игроков, сколько я хотел, следуя структуре этого объекта?

Вот примерно то, что у меня сейчас. Наивысшая оценка setState работает правильно. Я не уверен, как сделать очередь игрока. Я существенно обновляю табло. Мне также нужно это действие, чтобы изменить свое состояние на следующий ход игрока.

if (score > tableHighScore) {

          this.setState(prevState => ({
            highestScore: {
              score: score, 
              player: player,
              tableHighScore: score
            },
            //playerQueue: {
            //  ...prevState, dequeue();
            //}
          }));
        }

Answer 1

Я думаю, что вы можете использовать карту вместо простого объекта

const m = new Map();
m.set('key1', { id: 12, ... })
m.set('key2', { id: 12, ... })
// get the first entry
const firstEntry = m.entries().next().value // [ 'key1', {} ]
m.delete(firstEntry[0])
// add to the map 
m.set('key3', {})

и каждый раз, когда вы хотите изменить карту, вы должны сначала клонировать ее

const newMap = new Map(existingMap)