diff --git a/docs/2-browser-apps/03-class/index.mdx b/docs/2-browser-apps/03-class/index.mdx index 5228ea3b2..bfa235b5f 100644 --- a/docs/2-browser-apps/03-class/index.mdx +++ b/docs/2-browser-apps/03-class/index.mdx @@ -64,8 +64,24 @@ document.write(emptyFunction()); // 値を返さない関数の戻り値は unde `weightInTons` と `cost` をプロパティとして持ち、 `weightInTons` のデフォルト値が `1` であるクラス `Car` を作成し、 `cost` に好きな値を代入してみましょう。 + + +```javascript +class Car { + weightInTons = 1; + cost; +} + +const prius = new Car(); +prius.cost = 2600000; + +document.write(`重さは${prius.weightInTons}tで、値段は${prius.cost}円です。`); +``` + + + ## メソッド 同じプロパティを持つオブジェクトに対しては、同じような処理を行うことが多いです。例えば、学生はたいてい最初の授業で自己紹介をします。そこで、 `Student` クラスに、自己紹介をする関数 `introduceSelf()` を設定してみましょう。 @@ -338,26 +354,6 @@ document.write(myBirthDay.getFullYear()); // 2014 `getFullYear` メソッドは、年となる数値を返すメソッドです。 -{/* prettier-ignore */} -{/* TODO: 自分はこっちのほうがいいと思いますが... -例えば [`Map` クラス](https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Map)は、キーと値のペアを保存するオブジェクトを提供します。 - -```js -const map1 = new Map(); - -map1.set("a", 1); -map1.set("b", 2); -map1.set("c", 3); - -document.write(map1.get("a")); // 1 - -map1.set("a", 97); - -document.write(map1.get("a")); // 97 -``` - -\*/} - また、DOM を利用して `div` 要素を作成または取得すると、[`HTMLDivElement` クラス](https://developer.mozilla.org/ja/docs/Web/API/HTMLDivElement)のインスタンスが得られます。 このクラスは [`HTMLElement` クラス](https://developer.mozilla.org/ja/docs/Web/API/HTMLElement)を継承しており、 `HTMLElement` クラスは [`Element` クラス](https://developer.mozilla.org/ja/docs/Web/API/Element)を、`Element` クラスは [`Node` クラス](https://developer.mozilla.org/ja/docs/Web/API/Node)を継承しています。