Uczymy się czym są array-like objects i jak do nich dodawać kolejne elementy. Do dzieła.

Oto array-like object:

let arrLike = {
    0: 1,
    1: 2,
    2: 3,
    3: 4,
    4: 5,
    length: 5
  }

console.log(Array.from(arrLike));
//Array(5) [ 1, 2, 3, 4, 5 ];

Jak widać posiada cztery cechy:

  • Jest obiektem
  • Posiada właściwość length
  • Posiada numeryczne klucze i ich wartości
  • Za pomocą Array.from można go zamienić na tablicę JS

Ok, piszemy funkcję, która pozwala nam dodawać do obiektów array-like:

let arrLike2 = {};

function addToArrLike(arrLikeObj, elem){
    let arrLikeCopy = {...arrLikeObj};

    if(!arrLikeCopy.hasOwnProperty('length')){
        arrLikeCopy["length"] = 0;
    }
}

Tworzymy kopię. Jeżeli obiekt nie posiada length – ustawiamy na 0. Dalej:

function addToArrLike(arrLikeObj, elem){
    let arrLikeCopy = {...arrLikeObj};

    if(!arrLikeCopy.hasOwnProperty('length')){
        arrLikeCopy["length"] = 0;
    }

    let len = arrLikeCopy["length"];

    let outArrLike = {...arrLikeCopy, [len]: elem};

    outArrLike["length"] = ++len;

    return outArrLike;
  }

Pobieramy length, pod odpowiednim indeksem dodajemy element, zwiększamy length, zwracamy obiekt. Próba:

 let createdArrLike = {};

  createdArrLike = addToArrLike(createdArrLike, "a");
  createdArrLike = addToArrLike(createdArrLike, "b");
  createdArrLike = addToArrLike(createdArrLike, "c");

  console.log(createdArrLike);
  //Object { 0: "a", 1: "b", 2: "c", length: 3 }

  console.log(Array.from(createdArrLike));
  //Array(3) [ "a", "b", "c" ]

Tak właśnie działają array-like objects.