Разбить массив как значение в Observable <any []> на более мелкие куски

Question

Несколько часов я пытался воспроизвести процесс на массиве объектов с помощью Observable, но мне не повезло, что это удалось сделать!

Представьте, что у нас есть большой массив, такой как Observable:

[ 
  {name: "you1", id: 32}, 
  {name: "you2", id: 12}, 
  {name: "you3", id: 22},
  {name: "you4", id: 54}, 
  {name: "you", id: 09},
  {name: "you", id: 43}, 
  ....
]

, и вы хотите сгруппировать их по 3 массивам, и у каждого массива есть 2 элемента, подобных этому:

[ 
  [{name: "you1", id: 32}, {name: "you2", id: 12}], 
  [{name: "you3", id: 22}, {name: "you4", id: 54}], 
  [{name: "you", id: 09}, {name: "you", id: 43}], 
  ....
]

Этот диапазон является динамическим, и нам нужно сделать некоторые вычисления и преобразовать наблюдаемое значение в эту форму. Что ж, у меня это легко делается в Javascript, но я не знаю, как это можно сделать в RXJS. Любая помощь?

Вот как это было сделано в JS:

        let positionArray,
            positionItem = 0;
        const totalArray = this.groupedBySize > 0 ? Math.floor(size(this.selectedWorkspaces) / this.groupedBySize) : 0;
        this.selectedGroupedWorkspaces = [];

        for (positionArray = 0; positionArray < totalArray; positionArray += 1) {
            this.selectedGroupedWorkspaces[positionArray] = this.selectedWorkspaces.slice(
                positionItem,
                positionItem + this.groupedBySize
            );
            positionItem = positionItem + this.groupedBySize;
        }
        if (positionArray < totalArray || positionArray === 0) {
            this.selectedGroupedWorkspaces[positionArray] = this.selectedWorkspaces.slice(positionItem);
        }

        this.workspaces$ = of(this.selectedGroupedWorkspaces);

Answer 1

Это не более чем сокращение вашего массива:

const data = new rxjs.BehaviorSubject([ 
  {name: "you1", id: 32}, 
  {name: "you2", id: 12}, 
  {name: "you3", id: 22},
  {name: "you4", id: 54}, 
  {name: "you", id: 09},
  {name: "you", id: 43}, 
]);

const grouped = data.pipe(rxjs.operators.map(arr => arr.reduce((p, n) => {
  
  const last = p[0];
  if (last.length < 3) last.push(n);
  else p.unshift([n]);
  
  return p;
}, [[]]).reverse()));

grouped.subscribe(d => console.log(d));

<script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/6.5.2/rxjs.umd.js"></script>

Вы даже можете создать собственный оператор rxjs:

const data = new rxjs.BehaviorSubject([ 
  {name: "you1", id: 32}, 
  {name: "you2", id: 12}, 
  {name: "you3", id: 22},
  {name: "you4", id: 54}, 
  {name: "you", id: 09},
  {name: "you", id: 43}, 
]);

const groupArrayByGroupOf = length => rxjs.operators.map(arr => arr.reduce((p, n) => {
  
  const last = p[0];
  if (last.length < length) last.push(n);
  else p.unshift([n]);
  
  return p;
}, [[]]).reverse())

const grouped = data.pipe(groupArrayByGroupOf(3));

grouped.subscribe(d => console.log(d));

<script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/6.5.2/rxjs.umd.js"></script>