1 files changed, 107 insertions, 0 deletions
diff --git a/files/uk/web/javascript/reference/statements/with/index.html b/files/uk/web/javascript/reference/statements/with/index.html
new file mode 100644
index 0000000000..fca48fda25
--- /dev/null
+++ b/files/uk/web/javascript/reference/statements/with/index.html
@@ -0,0 +1,107 @@
+---
+title: with
+slug: Web/JavaScript/Reference/Statements/with
+tags:
+  - JavaScript
+  - Оператор
+  - не рекомендований
+translation_of: Web/JavaScript/Reference/Statements/with
+---
+<div class="warning">Використання оператора <code>with</code> не рекомендоване, оскільки може бути джерелом заплутаних помилок та проблем із сумісністю. Дивіться абзац "Мінуси для однозначності" у розділі "Опис", щоб дізнатись більше.</div>
+
+<div>{{jsSidebar("Statements")}}</div>
+
+<p>Оператор <strong>with</strong> розширює ланцюжок областей видимості для інструкції.</p>
+
+<h2 id="Синтаксис">Синтаксис</h2>
+
+<pre class="syntaxbox notranslate">with (expression)
+  <em>statement</em>
+</pre>
+
+<dl>
+ <dt><code>expression</code></dt>
+ <dd>Додає наданий вираз до ланцюжка областей видимості, який використовується під час обчислення інструкції. Круглі дужки навколо виразу є обов'язковими.</dd>
+ <dt><code>statement</code></dt>
+ <dd>Будь-яка інструкція. Щоб виконати більше однієї інструкції, скористайтесь <a href="/uk/docs/Web/JavaScript/Reference/Statements/block">блоком</a> ({ ... }), щоб згрупувати ці інструкції.</dd>
+</dl>
+
+<h2 id="Опис">Опис</h2>
+
+<p>JavaScript шукає некваліфіковане ім'я у ланцюжку областей видимості, пов'язаних з контекстом виконання скрипта чи функції, що містить це некваліфіковане ім'я. Оператор 'with' додає наданий об'єкт у початок цього ланцюжка під час обчислення своїх інструкцій. Якщо некваліфіковане ім'я, що використовується у інструкціях, співпадає з властивістю з ланцюжка областей видимості, це ім'я зв'язується з властивістю та об'єктом, що містить цю властивість. Інакше, викидається помилка {{jsxref("ReferenceError")}}.</p>
+
+<div class="note">Використання <code>with</code> не рекомендоване та заборонене у <a href="/uk/docs/Web/JavaScript/Reference/Strict_mode">строгому режимі </a>ECMAScript 5. Рекомендованою альтернативою є присвоєння об'єкта, чиї властивості вам потрібні, тимчасовій змінній.</div>
+
+<h3 id="Плюси_та_мінуси_для_швидкодії">Плюси та мінуси для швидкодії</h3>
+
+<p><strong>Плюси:</strong> Оператор <code>with</code> може допомогти зменшити розмір файлу, скорочуючи необхідність повторювати довгі посилання на об'єкти без погіршення швидкодії. Зміна ланцюжка областей видимості, спричинена використанням 'with', не є затратною для обчислення. Використання 'with' звільнить інтерпретатор від розбору повторюваних посилань на об'єкти. Зауважте, однак, що у багатьох випадках ця перевага досягається використанням тимчасової змінної для зберігання посилання на необхідний об'єкт.</p>
+
+<p><strong>Мінуси:</strong> Оператор <code>with</code> спочатку спричиняє пошук усіх імен на вказаному об'єкті. Таким чином, усі ідентифікатори, що не є членами вказаного об'єкта, шукатимуться у блоці 'with' набагато повільніше. У випадках, коли швидкодія важлива, 'with' слід використовувати лише у тих блоках коду, які звертаються до членів вказаного об'єкта.</p>
+
+<h3 id="Мінуси_для_однозначності">Мінуси для однозначності</h3>
+
+<p><strong>Мінус:</strong> З оператором <code>with</code> стає важко зрозуміти, людині чи компілятору JavaScript, чи буде некваліфіковане ім'я знайдене у ланцюжку областей видимості, і, якщо так, то в якому об'єкті. Отже, у наступному прикладі:</p>
+
+<pre class="brush: js notranslate">function f(x, o) {
+  with (o) {
+    console.log(x);
+  }
+}</pre>
+
+<p>Лише коли функція <code>f</code> викликана, змінна <code>x</code> або буде знайдена, або ні, а, якщо буде знайдена, то або в <code>o</code>, або (якщо такої властивості не існує) у об'єкті активації <code>f</code>, де <code>x</code> іменує перший формальний аргумент. Якщо ви забудете визначити <code>x</code> у об'єкті, який передаєте другим аргументом, або в разі якоїсь схожої помилки чи плутанини, ви не отримаєте помилку -- лише неочікувані результати.</p>
+
+<p><strong>Мінус: </strong>Код, що використовує <code>with</code>, може бути несумісним знизу вгору, особливо при використанні з чимось інакшим, ніж простий об'єкт. Розглянемо цей приклад:</p>
+
+<div>
+<pre class="brush:js notranslate">function f(foo, values) {
+  with (foo) {
+    console.log(values);
+  }
+}
+</pre>
+
+<p>Якщо ви викличете <code>f([1,2,3], obj)</code> у середовищі ECMAScript 5, то посилання <code>values</code> всередині блоку <code>with</code> поверне <code>obj</code>. Однак, ECMAScript 2015 вводить властивість <code>values</code> у {{jsxref("Array.prototype")}} (таким чином, доступну у кожному масиві). Отже, у середовищі JavaScript, яке підтримує ECMAScript 2015, посилання <code>values</code> всередині блоку <code>with</code> може повернути <code>[1,2,3].values</code>. Однак, конкретно у цьому прикладі {{jsxref("Array.prototype")}} було визначено з <code>values</code> у об'єкті {{jsxref("Symbol.unscopables")}}. Якби не це, ми б побачили, як важко було б його відлагоджувати.</p>
+</div>
+
+<h2 id="Приклади">Приклади</h2>
+
+<h3 id="Використання_with">Використання <code>with</code></h3>
+
+<p>Наступний оператор <code>with</code> вказує, що об'єкт <a href="/uk/docs/Web/JavaScript/Reference/Global_Objects/Math"><code>Math</code></a> є об'єктом за замовчуванням. Інструкції, що йдуть після <code>with</code>, посилаються на властивість <a href="/uk/docs/Web/JavaScript/Reference/Global_Objects/Math/PI"><code>PI</code></a>, а також методи <a href="/uk/docs/Web/JavaScript/Reference/Global_Objects/Math/cos"><code>cos</code></a> та <a href="/uk/docs/Web/JavaScript/Reference/Global_Objects/Math/sin"><code>sin</code></a> без зазначення об'єкта. JavaScript припускає, що об'єктом цих посилань є <code>Math</code>.</p>
+
+<pre class="brush:js notranslate">var a, x, y;
+var r = 10;
+
+with (Math) {
+  a = PI * r * r;
+  x = r * cos(PI);
+  y = r * sin(PI / 2);
+}</pre>
+
+<h2 id="Специфікації">Специфікації</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Специфікація</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-with-statement', 'with statement')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Сумісність_з_веб-переглядачами">Сумісність з веб-переглядачами</h2>
+
+
+
+<p>{{Compat("javascript.statements.with")}}</p>
+
+<h2 id="Див._також">Див. також</h2>
+
+<ul>
+ <li>{{jsxref("Statements/block", "block")}}</li>
+ <li><a href="/uk/docs/Web/JavaScript/Reference/Strict_mode">Строгий режим</a></li>
+ <li>{{jsxref("Symbol.unscopables")}}</li>
+ <li>{{jsxref("Array.@@unscopables", "Array.prototype[@@unscopables]")}}</li>
+</ul>