aboutsummaryrefslogtreecommitdiff
path: root/files/ru/web/javascript/reference/operators/class/index.html
diff options
context:
space:
mode:
Diffstat (limited to 'files/ru/web/javascript/reference/operators/class/index.html')
-rw-r--r--files/ru/web/javascript/reference/operators/class/index.html152
1 files changed, 152 insertions, 0 deletions
diff --git a/files/ru/web/javascript/reference/operators/class/index.html b/files/ru/web/javascript/reference/operators/class/index.html
new file mode 100644
index 0000000000..ad22c1abc1
--- /dev/null
+++ b/files/ru/web/javascript/reference/operators/class/index.html
@@ -0,0 +1,152 @@
+---
+title: class expression
+slug: Web/JavaScript/Reference/Operators/class
+translation_of: Web/JavaScript/Reference/Operators/class
+---
+<div>{{jsSidebar("Operators")}}</div>
+
+<div></div>
+
+<p><strong>Class expression</strong> это способ определения класса в ECMAScript 2015 (ES6). Схожий с <a href="/en-US/docs/Web/JavaScript/Reference/Operators/function">function expressions</a>, class expressions может быть именованным либо не иметь имени. Если он именованный, то его имя доступно только внутри класса. JavaScript классы используют прототипно-ориентированние наследование.</p>
+
+<h2 id="Синтаксис">Синтаксис</h2>
+
+<pre class="syntaxbox notranslate">var MyClass = class <em>[className]</em> [extends] {
+  // тело класса
+};</pre>
+
+<h2 id="Описание">Описание</h2>
+
+<p>Class expression имеет схожий сиснтаксис с {{jsxref("Statements/class", "class declaration (statement)", "", "true")}}. Однако в class expression можно опустить имя класса ("binding identifier"), что не допустимо с {{jsxref("Statements/class", "class declaration", "", "true")}}. Также class expression позволяет повторно объявить уже существующий класс и это <strong>не приведёт к ошибке типа</strong>, как при использовании {{jsxref("Statements/class", "class declaration", "", "true")}}. Свойство конструктора является опциональным. Результатом вызова оператора {{jsxref("Operators/typeof", "typeof")}} на классах, сгенерированных при помощи class expression, всегда будет "function".</p>
+
+<p>Так же, как и при использовании class declaration, тело класса у class expression будет исполняться в {{jsxref("Strict_mode", "строгом режиме", "", 1)}}.</p>
+
+<pre class="brush: js notranslate">'use strict';
+var Foo = class {}; // свойство конструктора опционально
+var Foo = class {}; // повторное объявление разрешено
+
+typeof Foo; // возвращает "function"
+typeof class {}; // возвращает "function"
+
+Foo instanceof Object; // true
+Foo instanceof Function; // true
+class Foo {}; // Throws TypeError, doesn't allow re-declaration
+</pre>
+
+<h2 id="Примеры">Примеры</h2>
+
+<h3 id="Простой_class_expression">Простой class expression</h3>
+
+<p>Простой анонимный class expression, на который можно сослаться с помощью переменной "Foo".</p>
+
+<pre class="brush: js notranslate">var Foo = class {
+ constructor() {}
+ bar() {
+ return "Hello World!";
+ }
+};
+
+var instance = new Foo();
+instance.bar(); // "Hello World!"
+Foo.name; // "Foo"
+</pre>
+
+<h3 id="Именованный_class_expression">Именованный class expression</h3>
+
+<p>Если вы хотите сослаться на конкретный класс внутри тела класса, вы можете создать именованный class expression. Это имя будет доступно только внутри области видимости самого class expression.</p>
+
+<pre class="brush: js notranslate">var Foo = class NamedFoo {
+ constructor() {}
+ whoIsThere() {
+ return NamedFoo.name;
+ }
+}
+var bar = new Foo();
+bar.whoIsThere(); // "NamedFoo"
+NamedFoo.name; // ReferenceError: NamedFoo is not defined
+Foo.name; // "NamedFoo"
+</pre>
+
+<h2 id="Спецификация">Спецификация</h2>
+
+<table class="standard-table">
+ <tbody>
+ <tr>
+ <th scope="col">Спецификация</th>
+ <th scope="col">Статус</th>
+ <th scope="col">Комментарий</th>
+ </tr>
+ <tr>
+ <td>{{SpecName('ES6', '#sec-class-definitions', 'Class definitions')}}</td>
+ <td>{{Spec2('ES6')}}</td>
+ <td>Первоначальное определение</td>
+ </tr>
+ <tr>
+ <td>{{SpecName('ESDraft', '#sec-class-definitions', 'Class definitions')}}</td>
+ <td>{{Spec2('ESDraft')}}</td>
+ <td></td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="Поддержка_брузерами">Поддержка брузерами</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+ <tr>
+ <th>Feature</th>
+ <th>Chrome</th>
+ <th>Firefox (Gecko)</th>
+ <th>Internet Explorer</th>
+ <th>Opera</th>
+ <th>Safari</th>
+ </tr>
+ <tr>
+ <td>Basic support</td>
+ <td>{{CompatChrome(42.0)}}</td>
+ <td>{{CompatGeckoDesktop(45)}}</td>
+ <td>{{CompatUnknown}}</td>
+ <td>{{CompatUnknown}}</td>
+ <td>{{CompatUnknown}}</td>
+ </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+ <tr>
+ <th>Feature</th>
+ <th>Android</th>
+ <th>Android Webview</th>
+ <th>Firefox Mobile (Gecko)</th>
+ <th>IE Mobile</th>
+ <th>Opera Mobile</th>
+ <th>Safari Mobile</th>
+ <th>Chrome for Android</th>
+ </tr>
+ <tr>
+ <td>Basic support</td>
+ <td>{{CompatNo}}</td>
+ <td>{{CompatChrome(42.0)}}</td>
+ <td>{{CompatGeckoMobile(45)}}</td>
+ <td>{{CompatUnknown}}</td>
+ <td>{{CompatUnknown}}</td>
+ <td>{{CompatUnknown}}</td>
+ <td>{{CompatChrome(42.0)}}</td>
+ </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Смотрите_также">Смотрите также</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Operators/function"><code>function</code> expression</a></li>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Statements/class"><code>class</code> statement</a></li>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Classes">Classes</a></li>
+</ul>