escape() у JavaScript — застаріле кодування символів рядка

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

escape() - це метод JavaScript, який призначений для перетворення певних символів у рядку на їхні закодовані у вигляді URI еквіваленти. Цей метод був досить популярним в ранніх версіях JavaScript, але зараз він є застарілим і не рекомендується для використання в сучасних застосуваннях.

Спочатку розглянемо, навіщо потрібен escape(). В основному, його використовували для того, щоб перетворити символи у рядку, які могли б порушити структуру URL. Наприклад, пробіл, знак "&" або "?". Якщо такі символи вставити безпосередньо у URL, це може призвести до проблем.

Приклад:

let url = "http://example.com?name=" + escape("John Doe");

У цьому прикладі, якщо не використовувати escape(), пробіл між "John" та "Doe" міг б порушити структуру URL.

Однак, існують і інші методи, такі як encodeURIComponent() і encodeURI(), які виконують подібні завдання, але з деякими важливими відмінностями. escape() не кодує символи такі як "@", "*", "-" і "_", тоді як encodeURIComponent() це робить.

Основні особливості та прийоми роботи з escape():

1. escape() кодує символи, які не є латинськими літерами, цифрами, а також деякими спеціальними символами, такими як "@", "*", "-" і "_".
2. Кодування відбувається шляхом заміни символу на "%", за яким слідує два шістнадцяткових символи.

Приклад:

let text = "Hello, World!";
let encodedText = escape(text);
console.log(encodedText); // Hello%2C%20World%21

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

правити

Порада

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

автор: Bond правити

Нотатка

Важливо знати, які символи кодуються escape() та іншими сучасними методами. Особливо, якщо ви намагаєтеся декодувати або аналізувати закодовані рядки. Наприклад, символ "@" не буде закодований методом escape(), але буде закодований за допомогою encodeURIComponent().

автор: Bond правити

Нотатка

Якщо з якоїсь причини вам потрібно працювати з рядками, які були закодовані за допомогою escape(), використовуйте unescape() для правильного декодування цих рядків. Проте пам'ятайте, що для рядків, закодованих за допомогою encodeURIComponent() або encodeURI(), потрібно використовувати decodeURIComponent() та decodeURI() відповідно.

автор: Bond правити

+ додати пораду чи нотатку

Синтаксис

escape(str)

Параметри

str

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

автор: Bond

правити

Повернення

string

Повертає новий рядок, в якому певні символи були замінені на їхні закодовані еквіваленти.

автор: Bond

правити

Переглядачі

Стаціонарні переглядачі Мобільні переглядачі Серверні переглядачі

Підтримка: стаціонарні переглядачі

Переглядач
	1	1	1	3	12	3

Підтримка: мобільні переглядачі

Переглядач
	4.4	18	4	1

Підтримка: серверні переглядачі

Переглядач
	0.10.0	1.0

Приклади

+ запропонувати свій приклад у пісочниці

<header>
  <h2 class="title">escape()</h2>
  <p class="description">Кодує набір символів у рядок у вигляді %XX або %uXXXX.</p>
</header>
<main>
  <div class="result">
    <label for="inputText">Введіть рядок для кодування:</label>
    <input type="text" id="inputText" placeholder="Привіт, як ти?" />
    <button onclick="showEscaped()">Кодувати</button>
    <p>Результат: <span id="outputText"></span></p>
  </div>
</main>

body {
  font-size: 16px;
  line-height: 1.5;
  font-family: monospace;
}

header {
  background-color: #f1f1f1;
  margin-bottom: 25px;
  padding: 15px;
  -webkit-box-shadow: 0px 0px 3px 0px rgba(118, 118, 118, 1);
  -moz-box-shadow: 0px 0px 3px 0px rgba(118, 118, 118, 1);
  box-shadow: 0px 0px 3px 0px rgba(118, 118, 118, 1);
}

header h2.title {
  padding-bottom: 15px;
  border-bottom: 1px solid #999;
}

header p.description {
  font-style: italic;
  color: #222;
}

.result {
  background-color: #f8f8f8;
  padding: 15px;
  -webkit-box-shadow: 0px 0px 3px 0px rgba(118, 118, 118, 1);
  -moz-box-shadow: 0px 0px 3px 0px rgba(118, 118, 118, 1);
  box-shadow: 0px 0px 3px 0px rgba(118, 118, 118, 1);
}

input {
  padding: 10px;
  margin-bottom: 10px;
}

button {
  padding: 10px 15px;
  background-color: #007BFF;
  color: white;
  border: none;
  cursor: pointer;
  transition: 0.3s;
}

button:hover {
  background-color: #0056b3;
}

function showEscaped() {
  const inputText = document.getElementById('inputText').value;
  const outputText = escape(inputText);
  document.getElementById('outputText').innerText = outputText;
}
//# sourceURL=pen.js

// Ініціалізація рядка зі спеціальними символами
let specialString = "Привіт, як ти?";

// Використання escape() для кодування рядка
let escapedString = escape(specialString);

console.log(escapedString);  // Виведе: "Привіт%2C%20як%20ти%3F"

// Ініціалізація рядка із не-ASCII символами
let nonASCIIString = "Місто: 東京";

// Використання escape() для кодування рядка
let escapedNonASCII = escape(nonASCIIString);

console.log(escapedNonASCII);  // Виведе: "%u674E%u4EAC"