Dlaczego {. . . .0} oceniać do {}?

Właśnie znalazłem {....0}w kodzie przyjaciela. Ocena tego w konsoli zwraca {}(pusty obiekt).

Dlaczego? Jakie jest znaczenie 4 kropek w JavaScript?

Cztery kropki właściwie nie mają znaczenia. ...jest operatorem rozprzestrzeniania i .0jest skrótem od 0.0.

Dlatego umieszczenie 0 (lub dowolnej liczby) w obiekcie daje pusty obiekt {}.

Trzy kropki w literale obiektu to właściwość spreadu , np .:

  const a = { b: 1, c: 1 };
  const d = { ...a, e: 1 }; // { b: 1, c: 1, e: 1 }

Ostatnia kropka z 0 to literał liczbowy, .0czyli to samo, co 0.0. Dlatego to:

 { ...(0.0) }

przenosi wszystkie właściwości obiektu liczbowego do obiektu, jednak ponieważ liczby nie mają żadnych (własnych) właściwości, otrzymujesz pusty obiekt.

Mówiąc {...}prościej, operator spreadu w javascript rozszerza jeden obiekt / tablicę o inny.

Tak więc, gdy babelifier próbuje rozszerzyć jeden o drugi, musi zidentyfikować, czy próbuje rozszerzyć tablicę, czy obiekt.

W przypadku arrayiteruje po elementach.

W przypadku objectiteruje po kluczach.

W tym scenariuszu babelyfier próbuje wyodrębnić klucze number, sprawdzając own property callbrakujące obiekty, numberwięc zwraca pusty obiekt.

Operator rozprzestrzeniania {...}umożliwia rozszerzanie elementów iteracyjnych. Oznacza to, że typy danych, które można zdefiniować w postaci key-valuepar, można rozszerzyć. W kategoriach Objectnazywamy parę klucz-wartość jako właściwość Object i jest to wartość, podczas gdy w kategoriach arraysmożemy myśleć o indeksie jako o kluczu, a element w tablicy jako o wartości.

let obj = { a: 4, b: 1};
let obj2 = { ...obj, c: 2, d: 4}; // {a: 4, b: 1, c: 2, d: 4}

let arr1 = ['1', '2'];
let obj3 = { ...arr1, ...['3']}; // {0: "3", 1: "2"}

Jeśli chodzi o tablicę, jako klucz przyjmuje indeks, więc tutaj zastępuje element „1” arr1z „3”, ponieważ oba mają ten sam indeks w innej tablicy.

W przypadku łańcuchów zbyt operator zwraca niepusty obiekt. Ponieważ łańcuch jest tablicą znaków, traktuje ciąg jako tablicę.

let obj4 = {...'hi',...'hello'}   // {0: "h", 1: "e", 2: "l", 3: "l", 4: "o"}
let obj5 = {...'y',...'x'}   // {0: "x" }

Ale w przypadku innych pierwotnych typów danych zwraca pusty obiekt

z liczbami

let obj6 = { ...0.0, ...55} // {}

z Boolean

let obj7 = { ...true, ...false} // {}

Podsumowując, te typy danych, które mogą być traktowane jako pary klucz-wartość, gdy są używane z operatorem spread, {...}zwracają niepusty obiekt, w przeciwnym razie zwraca pusty obiekt{}