Ответ
Атрибут `key` в React помогает идентифицировать элементы в списке при их обновлении, добавлении или удалении. React использует ключи для эффективного сравнения элементов и минимизации перерисовок DOM.
**Особенности:**
* Должен быть уникальным среди соседних элементов (не глобально)
* Лучше использовать стабильные ID из данных, а не индексы массива
* Не передаётся в компонент как пропс
**Пример:**
```
const items = [{id: 1, text: 'First'}, {id: 2, text: 'Second'}];
function List() {
return (
-
{items.map(item => (
- {item.text} ))}
Ответ 18+ 🔞
А, слушай, про этот ваш `key` в React! Ну, это ж классика, блядь, как Муму в мешке. Представь себе, у тебя список элементов, как эти твои дружки после пятницы — все похожие, но каждый со своей уникальной пиздобратиной.
Так вот, чтобы React не перепутал, кто из них Вася, а кто Петя, когда они начнут двигаться, добавляться или, не дай бог, удаляться — ему нужна метка. Вот эта метка и есть `key`. Без неё он, этот React, нихуя не сообразит, кто куда встал, и начнёт всех подряд перерисовывать, как последний распиздяй. А это, блядь, дорого — DOM-то трогать.
**Важные моменты, ёпта:**
* Уникальность нужна **только среди братьев-соседей** в одном списке. Не надо на всю вселенную уникальный ключ городить, только чтобы в этом конкретном `ul` или `div` он один такой был.
* **Используй стабильный ID из данных**, а не этот ёбаный индекс массива! Потому что если ты удалишь элемент из середины, индексы всех, кто после, съедут, и React нихуя не поймёт, что это тот же самый элемент, просто номер другой. Он подумает: "А, хуй с ним, всё поменялось!" и перерисует всё подряд. А состояние, если оно было, накрылось медным тазом. Вот и вся магия, в рот меня чих-пых.
* Этот `key` — он как тайная метка для самого React. В компонент-то он **не передаётся** как обычный пропс. Ты внутри компонента его не получишь. Он чисто для внутренней кухни.
**Смотри, как правильно, блядь:**
```jsx
const items = [{id: 1, text: 'Первый'}, {id: 2, text: 'Второй'}];
function List() {
return (
-
{items.map(item => (
// Вот тут, видишь? Берём стабильный id из данных. Не i, не index, а именно id!
- {item.text} ))}