Как работать с историей браузера в JavaScript?

Question

Accepted Answer

## Через `history` API

Объект `window.history` даёт доступ к истории сессии вкладки.

```js
history.back();    // как кнопка «Назад»
history.forward();
history.go(-2);    // на 2 шага назад

history.length;    // число записей (ограниченно полезно)
```

---

## SPA: pushState / replaceState

Без перезагрузки меняем URL и кладём state:

```js
history.pushState({ page: 2 }, "", "/list?page=2");
history.replaceState({ page: 1 }, "", "/list?page=1");

window.addEventListener("popstate", (e) => {
  console.log("state", e.state);
  // отрисовать экран под URL
});
```

- `pushState` — новая запись в истории.
- `replaceState` — заменить текущую.
- `popstate` — пользователь нажал Back/Forward (не при самом pushState).

---

## Связь с роутерами

React Router / Vue Router опираются на History API (или hash). На собеседовании достаточно: «меняем URL через history, слушаем popstate / роутер синхронизирует UI».

**Итог:** навигация «назад/вперёд» — `history.*`; для SPA без reload — `pushState`/`replaceState` + обработка `popstate`.