Jak używać operatora rozszerzenia (...)

Naucz się, jak używać operatora trzech punktów (...)...) nazywany również operatorem rozszerzenia.

Operator rozszerzenia (spread operator)

Operator rozszerzenia w JavaScript (...) Można rozszerzyć obiekt iterowalny (np. tablicę) na więcej elementów.

To pozwala nam szybko skopiować całą lub część istniejącej tablicy do innej tablicy:

przykład

Użyj operatora rozszerzenia w JavaScript do połączenia dwóch tablic

const liczbyJedna = [1, 2, 3];
const liczbyDwa = [4, 5, 6];
const liczbyPołączone = [...liczbyJedna, ...liczbyDwa];

Spróbuj sam

Operator rozszerzenia często używany jest do wyodrębniania wymaganych części z tablicy:

przykład

Przypisz pierwsze i drugie elementy tablicy liczby do zmiennych, a resztę umieść w innej tablicy:

const liczby = [1, 2, 3, 4, 5, 6];
const [jeden, dwa, ...pozostałe] = liczby;

Spróbuj sam

Możemy również używać operatora rozszerzenia na obiektach:

przykład

const myVehicle = {
  marka: 'Ford',
  model: 'Mustang',
  kolor: 'red'
}
const updateMyVehicle = {
  typ: 'car',
  rok: 2021,
  kolor: 'yellow'
}
const myUpdatedVehicle = {...myVehicle, ...updateMyVehicle}

Spróbuj sam

Proszę zauważyć, że niezgodne atrybuty zostały połączone, ale zgodne atrybuty kolor ostatni obiekt przekazany updateMyVehicle Zakryto. Ostateczny kolor jest teraz żółty.

Strony związane

Tutorial:JavaScript ES6