JavaScriptのクラスを定義する

プロパティのゲッターメソッド

全333コースを10日間無料で

ぜひご覧ください。

無料で視聴する すべての加入プランを見る
または
ゲッターメソッドを使えば、関数をプロパティのように扱えます。
講師:
05:42

字幕

このレッスンではプロパティのように扱える関数 getter メソッドについて説明します。今 MDN (Mozilla Developer Network) のレファレンスで getter のページを開いています。ここを開くにはmdn そして getter という風に調べたい項目を入力すれば非常によく参照されるサイトなのでかなり上の方に出てきます。今見ていたのがこの項目ですね。getter です。それから「ゲッタとセッタの定義」これは簡単に説明しているページなのでこちらをまず見ておきましょう。どんなことをするかと言うとここ関数に似ていますね。けれども get と書いてあります。これは読み取り専用のプロパティのように振る舞う関数です。今度は設定をする場合にはセッターと言うんですがset の後にまた関数と似たような記述があります。具体的な文法についてはこちらのページですね。書いてあるんですが今回はセッターは定義しません。ゲッターの方だけなんですけどもオブジェクトの中に定義してget の後にプロパティ名に相当するものを入れてfunction とは書きません。ただ、( ) 以降は function と同じ書き方をします。 サンプル、練習用のHTML ドキュメントを開きました。ここには Point というコンストラクタ関数つまりクラスが定義されています。そして一旦ここコメントアウトしてあるんですがプロパティを引数から設定します。それからここは prototype にもプロパティが設定できるということでy が設定してあるんですがこれはあくまで確認用でしたので消してしまいます。そして改行しておきましょう。prototype には getLength というメソッドとgetAngle というメソッドの2つがあります。これはどういうメソッドかと言うと原点からこの x y 座標までの距離を返すのが getLength です。それから x 座標を示す X 軸との成す角を返すのが getAngle ということになります。これはメソッドになっているんですがプロパティにしてしまうと扱いがしやすいかもしれません。ではこの2つを get メソッドということで定義しましょう。MDN のレファレンスで見た通り一旦ここインデントを入れましょう。get でgetLength がメソッドでしたけどもプロパティだったら length でいいですね。 length とします。そして function とは書かない。( ) 以降は function と同じです。それからオブジェクトのプロパティという形で定義しますのでセミコロンは最後に付けません。これをコピーで持っていきます。こうですね、ちょっとインデントを整えましょう。こんな感じです。もう1つプロパティとなるgetter メソッドを加えますのでカンマが必要ですね。そして同じく get のgetAngle から angle に変えます。そして function 以降をコピーしてセミコロンは外すと。そしてコピーを持っていきます。こうですね。そしてインデント、ここも整えます。これでオシマイですのでこの後にカンマは付けません。そしてこの部分はコメントアウトしましょう。オブジェクトを作りますけれどもx 座標は 1 でいいとしてy 座標は Math.スクウェア ルートですね。sqrt 平方根です。ルート3横が 1、高さが 3 、ルート3ということですからこれは三角定規の細長いやつですね。距離が2になります。それから角度は 60 度ということなんですがでは新たにプロパティとしてアクセスできるlength ですね。 ( ) は付けません。プロパティとしてアクセスします。そして obj のangle ですね。但し、これはラジアンという単位で出てきますから180 をかけてあげてスペースを入れましょうか。そして π ラジアンMath.PI で割れば度数として表示されます。では一旦保存をしてブラウザーで確かめてみましょう。「ブラウザーでプレビュー」です。そして「表示」>「開発管理」>「JavaScript コンソール」で誤差は出ていますけれども2 と 60 ということでプロパティのアクセスの仕方で関数を呼び出すことができたということです。このレッスンではプロパティのようにアクセスできる関数 getter メソッドの設定の仕方について説明しました。get そしてプロパティ名あと ( ) 以降はfunction、 関数と同じですね。それを prototype のプロパティにオブジェクトとして定めたということです。

JavaScriptのクラスを定義する

実はJavaScriptのクラスはプロトタイプというオブジェクトに基づいており、JavaやC++などのクラスとは多少異なります。またJavaScriptでクラスを定義することで機能を加えたり用途を広げることができます。このコースではJavaScriptのクラスの仕組みやコンストラクタ関数の定義、プロパティやメソッドの加え方などについて説明します。

2時間21分 (22 ビデオ)
現在、カスタマーレビューはありません…
 
ソフトウェア・トピック
価格: 2,990
発売日:2016年07月11日

このコースは、「オンデマンド」でご利用可能であり、ダウンロードすることもオンラインで見ることもできます。

ダウンロードすると、オフラインでコースを使用し、豊富なインターフェースをフルに活用できます。複数のデバイスを使用したり、 一度に全コースをダウンロードしたくない場合は、アカントにログインして、ストリーミング・ビデオとしてコースのレッスンを視聴してください。

ビデオトレーニングをお楽しみいただけますように! お問い合わせは、cs-jp@lynda.com宛までご連絡ください。