Запропонувати правку

Покращити цю статтю

Допрацюйте відповідь до «Що робить navigator?». Ваші зміни проходять модерацію перед публікацією.

Потрібне підтвердження

Контент

Що ви змінюєте

Заголовок (UA)

Коротка відповідь (UA)

Показується над повною відповіддю для швидкого нагадування.

Відповідь (UA)

## 1. Що таке navigator

`navigator` - це властивість об'єкта `window`,
і представляє **Browser Object Model (BOM)** - інтерфейс,
який дозволяє JavaScript взаємодіяти **з браузером, а не зі сторінкою**.

```javascript
console.log(window.navigator === navigator); // true
```

## 2. Приклад:

```javascript
console.log(navigator.userAgent);
console.log(navigator.language);
console.log(navigator.onLine);
```

Виведе інформацію на кшталт:

```javascript
"Mozilla/5.0 (Windows NT 10.0; Win64; x64)..."
"en-US"
true
```

## 3. Основні властивості navigator:

| Властивість | Що робить |
|---|---|
| `navigator.userAgent` | рядок, що описує браузер і ОС |
| `navigator.language` | мова інтерфейсу користувача (`"en-US"`, `"uk-UA"`) |
| `navigator.languages` | масив бажаних мов |
| `navigator.platform` | платформа/ОС (`"Win32"`, `"MacIntel"`, `"Linux x86_64"`) |
| `navigator.onLine` | `true`, якщо є інтернет |
| `navigator.cookieEnabled` | `true`, якщо у браузері дозволені cookies |
| `navigator.hardwareConcurrency` | кількість логічних ядер процесора |
| `navigator.deviceMemory` | обсяг оперативної пам'яті пристрою (в ГБ) |
| `navigator.vendor` | виробник браузера (наприклад, `"Google Inc."`) |

## 4. Методи navigator:

| Метод | Опис |
|---|---|
| `navigator.geolocation.getCurrentPosition()` | отримати геолокацію користувача |
| `navigator.clipboard.writeText()` / `readText()` | робота з буфером обміну |
| `navigator.share()` | викликати системне вікно "Поділитися" (на мобільних) |
| `navigator.vibrate()` | вібрація на мобільних пристроях |
| `navigator.mediaDevices.getUserMedia()` | доступ до камери й мікрофона |
| `navigator.serviceWorker` | робота з Service Workers (PWA, offline-режим) |
| `navigator.permissions.query()` | перевірка, чи дозволені API (наприклад, геолокація) |

## 5. Приклади використання:

### Перевірити браузер:

```javascript
if (navigator.userAgent.includes("Chrome")) {
  console.log("Користувач у Chrome");
}
```

### Перевірити з'єднання:

```javascript
if (!navigator.onLine) {
  alert("Немає підключення до Інтернету!");
}
```

### Отримати поточні координати:

```javascript
navigator.geolocation.getCurrentPosition(pos => {
  console.log(pos.coords.latitude, pos.coords.longitude);
});
```

> Цей метод запитує дозвіл у користувача.

### Скопіювати текст у буфер обміну:

```javascript
navigator.clipboard.writeText("Hello, world!");
```

### Отримати мову користувача:

```javascript
console.log(`Ваша мова: ${navigator.language}`);
```

## 6. Структура:

```javascript
window
 └── navigator
      ├── userAgent
      ├── language
      ├── geolocation
      ├── clipboard
      ├── mediaDevices
      └── ...
```

## Коротко:

| Що робить | Надає інформацію про браузер і пристрій |
|---|---|
| Де живе | Всередині `window` (`window.navigator`) |
| Можна дізнатись | тип браузера, мову, ОС, онлайн-статус |
| Можна робити | отримувати геолокацію, копіювати в буфер, викликати share, використовувати камеру |
| Типовий приклад | `navigator.userAgent`, `navigator.onLine`, `navigator.geolocation.getCurrentPosition()` |

> **Підсумок:**
> `navigator` - це об'єкт, через який JavaScript може
> **дізнатися характеристики браузера і пристрою**
> і **взаємодіяти з системними можливостями** (гео, камера, буфер обміну, PWA тощо).

Markdown · перетягуйте зображення · ⌘B / ⌘I шорткати394 слів

Для рев’юера

Примітка для модератора (необов’язково)

Бачить лише модератор. Прискорює рев’ю.