aboutsummaryrefslogtreecommitdiff
path: root/files/uk/web/javascript/reference/functions/set/index.html
diff options
context:
space:
mode:
authorPeter Bengtsson <mail@peterbe.com>2020-12-08 14:43:23 -0500
committerPeter Bengtsson <mail@peterbe.com>2020-12-08 14:43:23 -0500
commit218934fa2ed1c702a6d3923d2aa2cc6b43c48684 (patch)
treea9ef8ac1e1b8fe4207b6d64d3841bfb8990b6fd0 /files/uk/web/javascript/reference/functions/set/index.html
parent074785cea106179cb3305637055ab0a009ca74f2 (diff)
downloadtranslated-content-218934fa2ed1c702a6d3923d2aa2cc6b43c48684.tar.gz
translated-content-218934fa2ed1c702a6d3923d2aa2cc6b43c48684.tar.bz2
translated-content-218934fa2ed1c702a6d3923d2aa2cc6b43c48684.zip
initial commit
Diffstat (limited to 'files/uk/web/javascript/reference/functions/set/index.html')
-rw-r--r--files/uk/web/javascript/reference/functions/set/index.html152
1 files changed, 152 insertions, 0 deletions
diff --git a/files/uk/web/javascript/reference/functions/set/index.html b/files/uk/web/javascript/reference/functions/set/index.html
new file mode 100644
index 0000000000..b26e0e2824
--- /dev/null
+++ b/files/uk/web/javascript/reference/functions/set/index.html
@@ -0,0 +1,152 @@
+---
+title: сетер
+slug: Web/JavaScript/Reference/Functions/set
+tags:
+ - ECMAScript 2015
+ - ECMAScript 5
+ - JavaScript
+ - set
+ - функції
+translation_of: Web/JavaScript/Reference/Functions/set
+---
+<div>{{jsSidebar("Functions")}}</div>
+
+<p>Оператор <strong><code>set</code></strong> прив'язує властивість об'єкта до функції, яка буде викликана під час спроби присвоїти значення даній властивості.</p>
+
+<p>{{EmbedInteractiveExample("pages/js/functions-setter.html")}}</p>
+
+<div class="hidden">
+<p>The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</p>
+</div>
+
+<h2 id="Синтаксис">Синтаксис</h2>
+
+<pre class="syntaxbox notranslate">{set <em>prop</em>(<em>val</em>) { . . . }}
+{set [expression](<em>val</em>) { . . . }}</pre>
+
+<h3 id="Параметри">Параметри</h3>
+
+<dl>
+ <dt><em><code>prop</code></em></dt>
+ <dd>Ім'я властивості, котра має бути прив'язана до даної функції.</dd>
+</dl>
+
+<dl>
+ <dt><em><code>val</code></em></dt>
+ <dd>Псевдонім змінної, що містить значення, для якого виконується спроба присвоїти його властивості <em><code>prop</code></em>.</dd>
+ <dt><em>expression</em></dt>
+ <dd>Починаючи від ECMAScript 2015, можна також використовувати вираз для обчислюваного імені властивості, до якої буде прив'язана дана функція.</dd>
+</dl>
+
+<h2 id="Опис">Опис</h2>
+
+<p>У JavaScript сетер можна використати для виконання функції під час здійснення спроби змінити певну властивість. Найчастіше сетери використовуються у поєднанні з ґетерами для створення свого роду псевдовластивостей. Не можна водночас мати сетера на властивості, яка містить фактичне значення.</p>
+
+<p>Зауважте особливість використання синтаксису <code>set</code>:</p>
+
+<div>
+<ul>
+ <li>Він може мати ідентифікатор, який є або числом, або рядком;</li>
+ <li>Він повинен мати рівно один параметр (дивіться більше інформації у статті <a href="http://whereswalden.com/2010/08/22/incompatible-es5-change-literal-getter-and-setter-functions-must-now-have-exactly-zero-or-one-arguments/" rel="external nofollow noopener">Несумісна зміна <abbr title="ECMAScript 5th edition">ES5</abbr>: літеральні функції гетерів та сетерів тепер повинні мати рівно нуль аргументів та один аргумент</a>);</li>
+ <li>Він не повинен з'являтись у об'єктному літералі з іншим сетером чи введеними даними для тієї ж властивості.<br>
+ ( <code>{ set x(v) { }, set x(v) { } }</code> та <code>{ x: ..., set x(v) { } }</code> заборонені)</li>
+</ul>
+</div>
+
+<h2 id="Приклади">Приклади</h2>
+
+<h3 id="Визначення_сетерів_на_нових_обєктах_у_обєктних_ініціалізаторах">Визначення сетерів на нових об'єктах у об'єктних ініціалізаторах</h3>
+
+<p>Наступний код визначає псевдовластивість <code>current</code> об'єкта <code>language</code>. Коли <code>current</code> присвоюється значення, це змінює <code>log</code> на таке саме значення:</p>
+
+<pre class="brush: js notranslate">const language = {
+ set current(name) {
+ this.log.push(name);
+ },
+  log: []
+}
+
+language.current = 'EN';
+console.log(language.log); // ['EN']
+
+language.current = 'UA';
+console.log(language.log); // ['EN', 'UA']
+</pre>
+
+<p>Зверніть увагу, що  властивість <code>current</code> не визначена, і будь-які спроби звернутись до неї повернуть значення <code>undefined</code>.</p>
+
+<h3 id="Видалення_сетера_оператором_delete">Видалення сетера оператором <code>delete</code></h3>
+
+<p>Якщо вам потрібно прибрати сетер, ви можете його просто {{jsxref("Operators/delete", "видалити")}}:</p>
+
+<pre class="brush: js notranslate">delete o.current;
+</pre>
+
+<h3 id="Визначення_сетера_на_існуючому_обєкті_за_допомогою_defineProperty">Визначення сетера на існуючому об'єкті за допомогою <code>defineProperty</code></h3>
+
+<p>Щоб додати сетер до <em>існуючого</em> об'єкта, використовуйте {{jsxref("Object.defineProperty()")}}.</p>
+
+<pre class="brush: js notranslate">const o = {a: 0};
+
+Object.defineProperty(o, 'b', {
+ set: function(x) { this.a = x / 2; }
+});
+
+o.b = 10;
+// Запускає сетер, який присвоює 10 / 2 (5) властивості 'a'
+
+console.log(o.a)
+// 5</pre>
+
+<h3 id="Використання_обчислюваного_імені_властивості">Використання обчислюваного імені властивості</h3>
+
+<pre class="brush: js notranslate">const expr = 'foo';
+
+const obj = {
+ baz: 'bar',
+ set [expr](v) { this.baz = v; }
+};
+
+console.log(obj.baz);
+// "bar"
+
+obj.foo = 'baz';
+// запустити сетер
+
+console.log(obj.baz);
+// "baz"
+</pre>
+
+<h2 id="Специфікації">Специфікації</h2>
+
+<table class="standard-table">
+ <tbody>
+ <tr>
+ <th scope="col">Специфікація</th>
+ </tr>
+ <tr>
+ <td>{{SpecName('ESDraft', '#sec-method-definitions', 'Method definitions')}}</td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="Сумісність_з_веб-переглядачами">Сумісність з веб-переглядачами</h2>
+
+<div class="hidden">
+<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
+</div>
+
+<p>{{Compat("javascript.functions.set")}}</p>
+
+<div id="compat-mobile"></div>
+
+<h2 id="Див._також">Див. також</h2>
+
+<ul>
+ <li><a href="/uk/docs/Web/JavaScript/Reference/Functions/get">гетер</a></li>
+ <li>{{jsxref("Operators/delete", "delete")}}</li>
+ <li>{{jsxref("Object.defineProperty()")}}</li>
+ <li>{{jsxref("Object.__defineGetter__", "__defineGetter__")}}</li>
+ <li>{{jsxref("Object.__defineSetter__", "__defineSetter__")}}</li>
+ <li><a href="/uk/docs/Web/JavaScript/Guide/Working_with_Objects#Визначення_гетерів_та_сетерів">Визначення гетерів та сетерів</a> у посібнику JavaScript</li>
+</ul>