オブジェクト思考をプログラミング初心者に教える、ユゲタです。
getterとsetterはオブジェクト指向にとって必要不可欠なので、この技法を覚えていないと、他人の書いたコードすら読むことができないでしょう。
Javascriptも一昔前はclassすらない言語でしたが、バージョンアップを繰り返して、まあまあまともなclass定義ができるようになってきたし、
使えるインターネットブラウザがほぼ網羅されてきました。
IEも、もはやどのサービスにおいても除外対象にしているし、使っている人はコンピュータ事情自体遅れていると思うので、思考アップデートの必要に迫られている状態は容易に想像できます。
ということで、今回は、Javascriptを使って、getterとsetterを学習してみましょう。
getterって何?
Javascriptのclassオブジェクトにおける任意のプロパティを取得させる命令です。
<script type='module'>
import { Test } from './sample.js'
const test = new Test()
console.log(test)
</script>
export class Test{
constructor(){
this.name = 'ABCDEFG'
}
get a(){
return this.name
}
}
はずは上記の2ファイルを作って確認してみましょう。
実行すると、
Test
name : "ABCDEFG"
a : "ABCDEFG"
デバッグコンソールにこんな感じで表示されるはずです。
(折りたたまれている場合はクリックすると値が表示されます※GoogleChromeの場合)
Javascriptでは、何をやっているかと言うと、
Testというclassを作って、nameという内部変数(Testクラスのプロパティ)に"ABCDEFG"という文字列を入れています。
それをget aという箇所で、aプロパティでは、this.nameというnameプロパティを返すという処理をしています。
こんな感じで、そのclassの中で固定の値を返す(または固定の計算結果を返す)場合にget(getrer)を使うと便利で、
classの中でも、this.aという風にアクセスすることができます。
setterって何?
上記のソースを次のように変更してみましょう。(まるっと上書きしてください)
<script type='module'>
import { Test } from './sample.js'
const test = new Test()
test.a = 'Change!'
console.log(test)
</script>
export class Test{
constructor(){
this.name = 'ABCDEFG'
}
get a(){
return this.name
}
set a(str){
this.name = str
}
}
これを実行すると、次のような結果になります。
Test
name : "Change!"
a : "Change!"
そうです、setterというのは、set a(str)の箇所の事で、特定の処理を実施するためモノですね。
普通に内部関数として、a(str){...}と書いてしまうと、「同じプロパティがあるよ!」というエラーが出てしまうので、setter機能を使って、値を書き換える意味で使います。
setterとgetterってどういう場面で使えばいいの?
この疑問、オブジェクト指向をちゃんと理解する前は、自分もずっと疑問でした。
classオブジェクトは、単に関数をまとめているだけのものではなく、オブジェクト型という中でデータ一式を管理するという使い方をするのが一般的で、MVCのMの
Model箇所でよく使われます。
するとどうなるかというと、そのインスタンス(classオブジェクト)が入った変数の中のプロパティを簡単に参照できるようになり、便利なんですね。
例えば、Userとおいうclassを作った時に、ユーザー情報をまとめて内部変数で持っておくことで、ユーザーIDを送って出来上がったUserインスタンスで、いつでもユーザー情報を取得できるプログラムができるというワケですね。
この時に、User.nameやUser.typeという風に、簡単にアクセスできると便利なんですが、それを固定化させるために、class内でgetterを使い、それらを書き換えるために、setterを使うという感じで使うといいんですね。
あとがき
でも、javascriptのclass機能は、2022年12月現在時点で、privateモードというのが無いため、内部変数が全て丸見えになってしまいます。
この機能が入ったら、classオブジェクトとしては、javaなどのオブジェクト指向のプログラム言語と同じレベル(これだけでは足りてない機能もありますが・・・)に達するので、もうひと頑張りといったトコロですね。
でも、現時点でも、classオブジェクトを使って、効率のいいプログラムコードが構築できるようになっているので、使い慣れて、Javascriptでも、オブジェクト指向でプログラミングして、開発効率をアップさせてみてはいかがですか?
大きなプログラムを作るほど、このclassオブジェクトのありがたさが身にしみますよ。
参考
MDN : ゲッター
MDN : セッター
0 件のコメント:
コメントを投稿