質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.35%
コンストラクタ

オブジェクト指向言語において、オブジェクトを生成時に呼び出され、データの初期化などを行なう関数・メソッドのことである。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Q&A

解決済

1回答

2132閲覧

Java Script ではクラスをネストできるでしょうか?

909

総合スコア1

コンストラクタ

オブジェクト指向言語において、オブジェクトを生成時に呼び出され、データの初期化などを行なう関数・メソッドのことである。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

0グッド

0クリップ

投稿2021/05/20 10:41

クライアント側のHTMLを書いています。

html

1<script> 2 class a{ 3 constructor(){ 4 console.log(1); 5 class b{ 6 constructor(){ 7 console.log(2); 8 }; 9 }; 10 new b; 11 }; 12 }; 13 new a;

親クラスのコンストラクタの中でネストすれば問題ないのですが、

html

1<script> 2 class a{ 3 constructor(a,b){ 4 this.a1 = 1; 5 this.b2 = 2; 6 }; 7 af1(){ 8 let c = this.a1 + this.b1; 9 console.log('c is ' + c); 10 }; 11 af2(){ 12 let d = this.b1 - this.a1; 13 console.log('d is ' + d); 14 }; 15 class e{ 16 constructor(f,g){ 17 this.f3 = 3; 18 this.g4 = 4; 19 }; 20 bf1(){ 21 let h = this.f3 + this.g4; 22 console.log('h is ' + h); 23 bf2(){ 24 let i = this.g4 - this.f3; 25 console.log('i is ' + i); 26 let e2 = new e(5,6); 27 let j = e2.bf1.h + e2.bf2.i; 28 console.log('j is ' + j); 29 }; 30 }; 31 let a2 = new a(7,8); 32 let k = a2.af1.c + a2.af2.d; 33 console.log('k is ' + k); 34</script>

上記のように、親クラスのコンストラクタの外でネストすると、

class e{

の部分で、

Uncaught SyntaxError: unexpected token: identifier
どこかでセミコロン (;) を忘れています

のようなエラーになってしまいました。私は、

c is 3
d is 1
h is 7
i is 1
j is 11
k is 16

と表示される動作を期待していました。

解決法をご存知の方いらっしゃいましたら、よろしくお願いいたします。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

maisumakun

2021/05/20 10:43

「ネストせずに外側に書く」ではなにか不都合なのでしょうか? (クラス直下でクラスを宣言することは出来ません)
maisumakun

2021/05/20 10:47

そして、ネストとは関係なく、「a2.af1.c」の部分の辻褄が通っていません。
909

2021/05/20 10:49

ご回答に感謝します。そういうルールだったのですね。 親クラス名に、他の著名なライブラリ群と名前がかぶらなければ、 子クラスでは自由に命名できて便利そう、という発想でございました。 親コンストラクタの中で工夫してみます。ありがとうございました。
909

2021/05/20 11:09

勉強させていただきました。感謝いたします。
guest

回答1

0

ベストアンサー

親クラス名に、他の著名なライブラリ群と名前がかぶらなければ、

子クラスでは自由に命名できて便利そう、という発想でございました。

ブラウザに直接書くものはともかく、ES6 Moduleでは基本的にライブラリはグローバル名を使わないので、クラス名は勝手に設定して全く問題ありません。importで明示的に呼んできます。

投稿2021/05/20 10:52

maisumakun

総合スコア146018

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

909

2021/05/20 11:12

ありがとうございます。まだまだ勉強不足ですので、ご教示いただいたワードで検索してきます。ご回答に感謝いたします。
909

2021/05/20 11:27

別ファイルとして*.jsを外に置くシステムが、昨今の主流なのですね。 できれば、index.htmにペラ1で書いてしまいたかったのですが、 選択肢のひとつとして検討したいと思います。勉強になりました。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.35%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問