実現したいこと
this
を使用する意義と使用方法について理解を深めたいです。
前提
javascriptでタイピングゲームの作成に挑戦しており、
その過程でクラスについて学習しています。
お手本のコードは以下です。
js
class Panel { //クラス constructor() //コンストラクタ const section = document.createElement('section'); section.classList.add('panel'); this.img = document.createElement('img'); this.img.src = 'img/seven.png'; this.stop = document.createElement('div'); this.stop.textContent = 'STOP'; this.stop.classList.add('stop'); section.appendChild(this.img); section.appendChild(this.stop); const main = document.querySelector('main'); main.appendChild(section); } //インスタンス const panels = [ new Panel(), new Panel(), new Panel(), ];
質問内容
6行目~14行目にかけてthis
が多用されていますが、
これが何を意味するものか理解できません。
クラスから生成されるインスタンスを
this
で表示する
検索結果、上記の情報を得られましたが、this
とインスタンスの関連性が分からず混乱しています。
現状を踏まえ、以下3点についてお伺いしたいです。
1. this
とは一体何者なのか
2. this
はどのタイミングで使用されるのか
3. img
stop
には付与されるのに、main
やsection
にはなぜ付与されないのか
試してみたこと
this
の定義及び使用例について検索しました。
併せて、クラス
コンストラクタ
インスタンス
についても検索しました。
一通り言葉の意味を理解することはできましたが、
まだ点として理解している感覚です。
各用語がどのように紐づいてクラスを成すのか、
こちらの質問を通じて理解したいです。
0 コメント