javascirptのクラスについてのメモ
- 後からフィールドを追加できる
class dog{ constructor(name ){ this.name = name; } } let yourDog = new dog('gol-chan'); console.log(yourDog); yourDog.breed = 'golden retriever'; // 犬種の追加 console.log(yourDog);
実行結果
dog { name: 'gol-chan' } dog { name: 'gol-chan', breed: 'golden retriever' }
Java とVBAを少し触った程度ですが、私が確かインスタンスにフィールド変数を追加するのはできなかったと思います。変な感じです。
- クラスは関数
class dog{ constructor(name, breed){ this.name = name; this.breed = breed; } bow(){ console.log('bow bow!'); } } let yourDog = new dog('gol-chan', 'golden retriever'); console.log('type of dog : ' + typeof(dog)); console.log('type of yourDog : ' + typeof(yourDog));
実行結果
type of dog : function type of yourDog : object
- だいたい連想配列?(要検証)
class dog{ constructor(name, breed){ this.name = name; this.breed = breed; } bow(){ console.log('bow bow!'); } } let yourDog = new dog('gol-chan', 'golden retriever'); let myDog = { name : 'lab-chan', breed : 'labrador retriever', bow : function(){ console.log('bow bow!'); } }; console.log(yourDog); console.log(myDog); console.log('type of yourDog : ' + typeof(yourDog)); console.log('type of myDog : ' + typeof(myDog)); yourDog.bow(); myDog.bow();
実行結果
★console.log(yourDog);の実行結果 dog { name: 'gol-chan', breed: 'golden retriever' } ★console.log(myDog);の実行結果 { name: 'lab-chan', breed: 'labrador retriever', bow: [Function: bow] } ★ typeofの結果 type of yourDog : object type of myDog : object ★ 実行方法は同じ bow bow! bow bow!
console.logを行うと、連想配列とだいたい同じですが、
・classのインスタンスはfunctionが表示されない
・classのインスタンスは{}の前にクラスの名前が表示される
のですね。
ES6のクラスは、実際のところ以前のclassの実装の別表記でしかないらしいので、今後しっかり理解する必要があると思いました。
以下を参考にさせていただこうと思っています。
・や…やっと理解できた!JavaScriptのプロトタイプチェーン