Реагировать Учебник

Реагировать Главная Реагировать Введение Реагировать Начать Реагировать ES6 Реагировать на визуализацию HTML Реагировать JSX Реагировать Компоненты Реагировать на класс Реагировать на реквизиты Реагировать на события Реагировать на условия Реагировать списки Реагировать на формы Реактивный маршрутизатор Реагировать на заметку Реагировать на стили CSS Реагировать на стиль Sass

Реагировать на крючки

Что такое крючок? использование состояния использованиеЭффект использованиеконтекста useRef использованиередьюсер использоватьОбратный звонок useMemo Пользовательские крючки

Упражнения по реагированию

Ответная викторина Упражнения по реагированию Сертификат реакции

Оператор распространения React ES6


Оператор спреда

Оператор распространения JavaScript ( ...) позволяет нам быстро скопировать весь или часть существующего массива или объекта в другой массив или объект.

Пример

const numbersOne = [1, 2, 3];
const numbersTwo = [4, 5, 6];
const numbersCombined = [...numbersOne, ...numbersTwo];

Оператор распространения часто используется в сочетании с деструктурированием.

Пример

Присвойте первый и второй элементы from numbersпеременным, а остальные поместите в массив:

const numbers = [1, 2, 3, 4, 5, 6];

const [one, two, ...rest] = numbers;

Мы также можем использовать оператор распространения с объектами:

Пример

Объедините эти два объекта:

const myVehicle = {
  brand: 'Ford',
  model: 'Mustang',
  color: 'red'
}

const updateMyVehicle = {
  type: 'car',
  year: 2021, 
  color: 'yellow'
}

const myUpdatedVehicle = {...myVehicle, ...updateMyVehicle}

Обратите внимание, что свойства, которые не совпали, были объединены, но свойство, которое совпало color, было перезаписано последним переданным объектом, updateMyVehicle. Полученный цвет теперь желтый.


Проверьте себя с помощью упражнений

Упражнение:

Используйте оператор распространения, чтобы объединить следующие массивы.

const arrayOne = ['a', 'b', 'c'];
const arrayTwo = [1, 2, 3];
const arraysCombined = [];