From 1ff79a65eac4ff27a08aad49483bbee8494c3282 Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Wed, 16 Feb 2022 23:41:28 +0900 Subject: 2021/07/21 時点の英語版に同期 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../javascript/reference/operators/class/index.md | 115 ++++++++++----------- 1 file changed, 52 insertions(+), 63 deletions(-) (limited to 'files/ja/web/javascript/reference') diff --git a/files/ja/web/javascript/reference/operators/class/index.md b/files/ja/web/javascript/reference/operators/class/index.md index c21b8594c7..41ed2fce2e 100644 --- a/files/ja/web/javascript/reference/operators/class/index.md +++ b/files/ja/web/javascript/reference/operators/class/index.md @@ -2,45 +2,45 @@ title: クラス式 slug: Web/JavaScript/Reference/Operators/class tags: - - Class - - Classes - - ECMAScript6 - - Expression + - クラス + - ECMAScript 2015 + - 式 - JavaScript - - Operator - - Reference + - 言語機能 + - 演算子 + - リファレンス +browser-compat: javascript.operators.class translation_of: Web/JavaScript/Reference/Operators/class --- -
{{jsSidebar("Operators")}}
+{{jsSidebar("Operators")}} -

クラス式は、 ECMAScript 2015 でクラスを定義する方法の 1 つです。{{jsxref("Operators/function", "関数式", "", "true")}}と同じように、クラス式は名前を付けることも付けないこともできます。名前を付ける場合、クラス名はクラス内部のみのローカルです。

+**クラス式**は、 ECMAScript 2015 でクラスを定義する方法の 1 つです。{{jsxref("Operators/function", "関数式", "", "true")}}と同じように、クラス式は名前を付けることも付けないこともできます。名前を付けた場合、クラス名はクラス内部のみのローカルです。 -

JavaScript のクラスはプロトタイプベースの継承が使われます。

+JavaScript のクラスはプロトタイプベースの継承が使われます。 -
{{EmbedInteractiveExample("pages/js/expressions-classexpression.html")}}
+{{EmbedInteractiveExample("pages/js/expressions-classexpression.html")}} - +## 構文 -

構文

- -
const MyClass = class [className] [extends otherClassName] {
-    // クラス本体
-};
+```js +const MyClass = class [className] [extends otherClassName] { + // クラス本体 +} +``` -

説明

+## 解説 -

クラス式の構文は、{{jsxref("Statements/class", "クラス宣言 (文)", "", "true")}} と似ています。 class 文では、 class 式の本体が{{jsxref("Strict_mode", "厳格モード", "", 1)}}で実行されます。

+クラス式の構文は、{{jsxref("Statements/class", "クラス宣言(文)", "", "true")}} と似ています。 `class` 文では、 `class` 式の本体が{{jsxref("Strict_mode", "厳格モード", "", 1)}}で実行されます。 -

しかし、クラス式と{{jsxref("Statements/class", "クラス文", "", "true")}}はいくつかの相違点があります。

+しかし、クラス式と{{jsxref("Statements/class", "クラス文", "", "true")}}ではいくつかの相違点があります。 - +- クラス式ではクラス名(「束縛識別子」 (binding identifier))を省略できますが、{{jsxref("Statements/class", "クラス文", "", "true")}}では省略できません。 +- クラス式は {{jsxref("Global_Objects/SyntaxError", "SyntaxError")}} を**発生させずに**クラスを再宣言することができます。これは{{jsxref("Statements/class", "クラス文", "", "true")}}の場合はできません。 -

constructor メソッドは省略可能です。クラス式で生成されたクラスは、常に {{jsxref("Operators/typeof", "typeof")}} が "function" の値を返します。

+`constructor` メソッドは省略可能です。クラス式で生成されたクラスは、常に {{jsxref("Operators/typeof", "typeof")}} が "`function`" の値を返します。 -
'use strict';
+```js
+'use strict';
 let Foo = class {};  // コンストラクタープロパティは省略可能
 Foo = class {};      // 再宣言が可能
 
@@ -49,16 +49,17 @@ typeof class {};        // "function" を返す
 
 Foo instanceof Object;   // true
 Foo instanceof Function; // true
-class Foo {}            // SyntaxError が発生 (クラス宣言は再宣言ができない)
-
+class Foo {} // SyntaxError が発生 (クラス宣言は再宣言ができない) +``` -

+## 例 -

簡単なクラス式

+### 簡単なクラス式 -

以下は、名前のない簡単なクラス式です。変数 Foo を使って参照できます。

+以下は、名前のない簡単なクラス式です。変数 `Foo` を使って参照できます。 -
const Foo = class {
+```js
+const Foo = class {
   constructor() {}
   bar() {
     return 'Hello World!';
@@ -68,13 +69,14 @@ class Foo {}            // SyntaxError が発生 (クラス宣言は再
 const instance = new Foo();
 instance.bar();  // "Hello World!"
 Foo.name;        // "Foo"
-
+``` -

名前付きクラス式

+### 名前付きクラス式 -

クラス内部で現在のクラスを参照したい場合は、名前付きクラス式を作成してください。この名前は、そのクラス式自身のスコープ内だけで見ることができます。

+クラス内部で現在のクラスを参照したい場合は、*名前付きクラス式*を作成してください。この名前は、そのクラス式自身のスコープ内だけで見ることができます。 -
const Foo = class NamedFoo {
+```js
+const Foo = class NamedFoo {
   constructor() {}
   whoIsThere() {
     return NamedFoo.name;
@@ -84,31 +86,18 @@ const bar = new Foo();
 bar.whoIsThere();  // "NamedFoo"
 NamedFoo.name;     // ReferenceError: NamedFoo is not defined
 Foo.name;          // "NamedFoo"
-
- -

仕様書

- - - - - - - - - - - - -
仕様書
{{SpecName('ESDraft', '#sec-class-definitions', 'Class definitions')}}
- -

ブラウザーの互換性

- -

{{Compat("javascript.operators.class")}}

- -

関連情報

- - +``` + +## 仕様書 + +{{Specifications}} + +## ブラウザーの互換性 + +{{Compat}} + +## 関連情報 + +- {{jsxref("Operators/function", "関数式", "", "true")}} +- {{jsxref("Statements/class", "クラス宣言", "", "true")}} +- {{jsxref("Classes", "クラス", "", "true")}} -- cgit v1.2.3-54-g00ecf