Наповнення JS розділу

Добридень, Пані та Панове, завдяки вам вдалося зібрати більше 19тис грн з необхідних 15тис на впровадження JS розділу.

JS розділ вже впроваджено - переходимо до його наповнення і почнемо бігти довгий марафон, адже JS має більше 1100 різноманітних методів, властивостей, подій і т.д., які необхідно описати.

Будемо працювати, і вдень, і вночі, щоб орієнтовно взимку закінчити наповнювати JS розділ!

Ви також можете допомогти нам в цьому. Долучайтеся до нашої спільноти в дискорді - ставайте її частиною і допомагайте нашому розвитку.

Також, підтримуйте нас матеріально.

JS метод Global.encodeURI()

Загальний опис

encodeURI() є вбудованим методом у JavaScript, який призначений для кодування тексту в формат, який є безпечним і придатним для використання в уніфікованих ідентифікаторах ресурсів (URI). Завдяки йому можна гарантувати, що URL-адреси будуть читатися і інтерпретуватися правильно між різними ресурсами і платформами.

Однією з основних причин використання encodeURI() є потреба забезпечити, що спеціальні символи в URL-адресі, такі як "&", "#", " ", та інші, не будуть викликати непередбачених проблем під час переходу по посиланню або відправки запиту. Інакше кажучи, цей метод перетворює символи в URL-адресі в їх відсоткове кодування, яке може бути безпечно передано через інтернет.

Приклад:

const url = "Hello World!";
const encodedURL = encodeURI(url);
console.log(encodedURL); // Hello%20World%21

У цьому прикладі пробіл в "Hello World!" було закодовано як %20, а знак оклику – як %21.

encodeURI() корисний у ряді сценаріїв. Наприклад, при додаванні даних, отриманих від користувача, до URL-адреси перед відправкою запиту на сервер або при створенні посилань, що включають динамічний контент.

Важливо відзначити, що encodeURI() кодує лише ті символи, які мають спеціальне значення у URI. Він не кодує символи, такі як ":", "/", "?" та "@", оскільки вони вважаються дійсними символами в структурі URL. Якщо потрібно кодувати кожний символ у тексті, рекомендується використовувати encodeURIComponent() замість encodeURI().

Приклад відмінностей:

const data = "Hello, how are you? Have a nice day!";
const uri = encodeURI(data);
const uriComponent = encodeURIComponent(data);
console.log(uri); // Hello,%20how%20are%20you?%20Have%20a%20nice%20day!
console.log(uriComponent); // Hello%2C%20how%20are%20you%3F%20Have%20a%20nice%20day%21

Як бачимо, encodeURIComponent() кодує більше символів, ніж encodeURI().

Нотатка:

Пам'ятайте, що повторне кодування вже закодованого URL може призвести до непередбачуваних результатів. Додавання додаткового кодування до вже закодованого URL може зробити його непридатним для використання.

Приклад:

const encodedParam = encodeURIComponent("name=John&age=20");
const doubleEncoded = encodeURIComponent(encodedParam); // Неправильно!
Порада:

Перед використанням encodeURI() завжди визначайте, яку частину URL ви плануєте кодувати. Якщо кодуєте лише параметри запиту або інші компоненти URL, які можуть містити спеціальні символи, розгляньте використання encodeURIComponent() замість encodeURI() для більш точного кодування.

Приклад:

const base = "https://example.com/query?";
const param = "name=John&age=20";
const encodedURL = base + encodeURIComponent(param);
Порада:

Коли ви кодуєте URL за допомогою encodeURI(), завжди перевіряйте результат, щоб бути впевненим, що він відповідає вашим очікуванням. Іноді деякі символи можуть залишитися некодованими, що може призвести до проблем при обробці URL на сервері або в інших середовищах.

Порада:

Якщо ви розробляєте великі системи або фреймворки, розгляньте можливість створення загальних службових функцій для кодування URL, які б враховували особливості вашої системи та інші вимоги безпеки. Це може допомогти уникнути типових помилок при кодуванні і забезпечити консистентність у всьому проекті.

Синтаксис

encodeURI(uri)

Параметри

*uri

Рядок, який потрібно закодувати як URI.

Return

string

Повертає новий рядок, який представляє наданий рядок, закодований як URI.

Exception

URIError: ця помилка виникає, якщо в URI присутній окремий сурогатний символ, який не може бути закодований методом.

Переглядачі

Переглядач

1

1

1.1

7

12

Переглядач

4.4

18

4

1

Переглядач

0.10.0

1.0

Приклади


В інтерфейсі користувач вводить текст для кодування у поле введення. Після натискання на кнопку "Кодувати", текст буде закодований за допомогою методу encodeURI() і результат буде відображений на сторінці.

У даному прикладі ми маємо базову URL адресу, до якої потрібно додати рядок запиту. Користувач вводить рядок "Книги про JavaScript&author=Джон", але цей рядок містить символ "&", який є спеціальним символом в URL. Використовуючи метод encodeURI(), ми кодуємо цей рядок таким чином, щоб його можна було безпечно додати до URL.

// Базова URL адреса
const baseURL = "https://example.com/search?query=";

// Рядок пошуку, введений користувачем
const userQuery = "Книги про JavaScript&author=Джон";

// Кодуємо рядок запиту, щоб можна було його безпечно додати до URL
const encodedURL = baseURL + encodeURI(userQuery);

console.log(encodedURL);
// Виведе: "https://example.com/search?query=Книги%20про%20JavaScript&author=%D0%94%D0%B6%D0%BE%D0%BD"

Тут ми маємо заголовок новини, який хочемо поділитися у Twitter. Однак, перед тим як додати цей заголовок до URL для ділитися, нам потрібно його закодувати. Для цього ми використовуємо метод encodeURI(). В результаті отримуємо коректний URL, який можна використовувати для ділитися контентом у соціальних мережах.

// Заголовок новини, який користувач хоче поділитися
const newsTitle = "Новий курс про JavaScript в Україні!";

// Кодуємо заголовок, щоб створити URL для ділитися новиною у Twitter
const shareURL = "https://twitter.com/intent/tweet?text=" + encodeURI(newsTitle);

console.log(shareURL);
// Виведе: "https://twitter.com/intent/tweet?text=Новий%20курс%20про%20JavaScript%20в%20Україні!"