JavaScriptのクラスを定義する

Object.defineProperty()メソッドでプロパティを定める

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

ぜひご覧ください。

無料で視聴する すべての加入プランを見る
または
Object.defineProperty()メソッドを使うと、オブジェクトに書き替えのできないプロパティが定められます。
講師:
05:59

字幕

このレッスンではオブジェクトに書き換えのできないプロパティを定めてみたいと思います。今開いている HTML ドキュメントPoint というクラス、これはスーパークラスでVector というクラスがこの Point の prototype をprototype に設定して継承してるんですが今回はこの Point クラスに書き換えのできないプロパティを定めたいと思います。何を使うかと言うと今ここに角度のラジアンの単位の角度を度数に直す為のプロパティが定められています。RAD_TO_DEG という名前なんですがそこにその比率の値が設定されています。下の方でテストコードを書きましょう。まずは console.log で今の Point クラスに定めたRAD_TO_DEG を確認します。そしてこのプロパティにコピーして数字1を入れます。そして同じ console.log引数で呼び出します。これでどうなるか大体想像はつくと思うんですけどもファイルを保存して「ブラウザーでプレビュー」します。「表示」>「開発 / 管理」>「JavaScript コンソール」 を出します。そうすると、この 57. いくつというのが正しい比率なんですけども1に変わってしまいました。 この比率はラジアンを度数に変える為に決めた比率でこの値が変わることはないですね。書き換えはできて欲しくないわけです。そういう場合に使うメソッドというのがあります。MDN (Mozilla Developer Network) のレファレンスでObject.defineProperty というメソッドを表示しています。構文はこんな感じなんですけどもまずはプロパティを加えたいオブジェクトを指定します。そしてその名前それからディスクリプタというので細かい設定ができるんですがそれは、まず例の方から先に見ましょう。こんな感じで Object で指定するんですね。プロパティの場合 4つ指定できるものがあって今回 value に先程の比率を設定します。そうすると、このプロパティにここで定めた値が入ります。あと3つ定められるんですがこれは true false の論理値になっています。そして3つ false になっているんですけども実はレファレンスを確認すると既定値はみな false なんですね。今回はこの value 以外はfalse で構わないのでfalse つまりデフォルト値で指定します。つまり value 以外は指定しません。 その場合今回注目したいのはここです。writable、書き換え可能で true であれば値が変更できるんですね。既定値は false ですから値が変更できなくなります。今回この設定がぴったりです。では早速 defineProperty メソッドを使います。ということなので、この代入する文はコメントにして無効にします。呼び出しは Object のdefineProperty です。そして設定したいオブジェクトはこの Point です。Point は関数なんですけどもJavaScript では関数もオブジェクトとして扱われます。ですからコピーを持ってきます。そしてその後に名前は文字列で指定します。ここではシングルクォーテーションを使っていますかね。シングルでもダブルでもいいんですがどちらかに統一した方がいいのでそして名前はこれです。RAD_TO_DEG ですね。そしてその後はいくつかあるプロパティのうちのvalue だけ設定します。そしてこの比率ですね。この比率をプロパティの名前の後に持ってきます。テストのコードは先程と書き換えていません。ですから 最初に元々のRAD_TO_DEG の値を出して1を設定してからどうなったかということを確認したいと思います。 では ファイルを保存しましょう。先程は まず比率の正しい値が出てその後1に変わってしまったんですね。では リロードしてみましょう。今度は1に変わりません。ということで、書き換えできない読み取り専用のプロパティあの場合は定数と言っていいと思うんですが定数の設定ができました。このレッスンでは書き換えのできないプロパティを設定しました。メソッドは Object.definePropertyというメソッドです。そして指定したいオブジェクトを第1引数として書きます。この場合関数も使えるということですね。それからプロパティの名前と必要なディスクリプタ というプロパティを設定していきます。今回は value のみ設定するとWritable 書き換え可能がデフォルトでは false なので書き換えのできないプロパティ定数が設定できたということです。

JavaScriptのクラスを定義する

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

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

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

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

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