こんにちは。
今回はJavaScriptさわってみる企画です。ひっさしぶりですねー(;´∀｀)。実はまだ終わっていないのですよ。
本を読んでいるのですが私の読解力が低いので全然わからなくてなかなか進まないのです。まだ基本の章にいますｗ
そして今回のネタは”プロトタイプ”っていう仕組みについてです。
RPGツクールMZのコアスクリプトやプラグインで結構見かけたことがあるような気がします。
○○.prototype.○○=… みたいな記述。どうやらアレのことのようです。
本の説明は正確性を重視してるので初心者の私にはよくわかりません。
ここでは正確性を切り捨てた初心者の解釈を書きます↓
JavaScriptにはプロトタイプっていう他のオブジェクトのメソッドを参照するっていう仕組みがあるそうな。
たとえば var str1 = "aiueo"; と初期値”aiueo”の変数 str1 を宣言したとき、文字列オブジェクトを作成しているとも言えるそうで、文字列オブジェクトのメソッドの１つ、charAt()メソッドがつかえます。
charAt()メソッドはカッコ内の数字の場所(最初は０)の1文字を返すというメソッドなのでstr1.charAt(0); とすると ”a” になるわけですが、charAt()メソッドを定義していないstr1にcharAt()メソッドが使えるのはプロトタイプオブジェクトを参照しているからだというのです。そしてこの動作はプロトタイプが辿れなくなるまで繰り返すそうな。
…うーん(;´∀｀)
つまり何が言いたいのかっていうのを初心者なりに考えてみました。
このプロトタイプの仕組みによって「いくらでも標準装備のお好み機能(メソッド)を付け足すことができるんだぜ」ってことだと思います。
そう思うとなんだか便利そうですね(゜-゜)
それではやってみましょう。
prototypeとオブジェクトを紐づけるには、コンストラクタにprototypeを設定し、そのコンストラクタでオブジェクトを作成するという手順になるそうです。
文字列オブジェクトに新たに”tanu”という機能を追加(参照先の追加)してみます。文字列コンストラクタは”String”です。
<script>
String.prototype.tanu = function(){
var a = "pon"+ this;
return a;
}var str = new String();
function btnprsd(){
str = document.getElementById("aaa").textContent;
aaa.innerHTML = str.tanu();
}</script>
<button onclick="btnprsd()">機能発動</button>
<p id="aaa">poco</p>
最初のString.prototype.tanu = function(){～でコンストラクタにプロトタイプを設定、文字列に”pon”を付け足して返すっていう機能をつくってます。名前はtanuといいます。
var str = new String();でオブジェクト作成。
function btnprsd(){~の最後、str.tanu(); で 追加した機能を使っています。
このスクリプトの全体の説明をすると、「ボタンを押すたびに文字列”pon”が付け足されます。」です。
実行結果です。お試しください。↓
poco
はい。なんともしょーもない機能。ですが機能の中身よりも.tanu()という機能を”追加できた”ってところがきっと大事なのです。
これの理解にすんごい日数がかかりました。今回はここまで。たぶんもうすぐ終わりです！
ありがとうございました。
次回↓
icedtomatobazooka.site
丸ペンを使ってみる。
