Javascriptの「String.prototype.trimIt」とは何を意味するのでしょうか？

Question

javascriptを勉強中に下記の記述に出くわしたのですが、「String.prototype.trimIt」とは何を意味するのでしょうか？

例えば
「hoge.trimIt = function() {
return this.replace(/^\s+|\s+$/g, '');
}」

であれば
「hogeオブジェクトにtrimItという名前のfunction() {
return this.replace(/^\s+|\s+$/g, '');
}を値に持つプロパティーを設定」
という意味になると思うのですが、「String.prototype.trimIt」ですと「.」が2つありますし、何がどうなっているのかさっぱりわかりません。

どなたか詳しい方御指導頂けないでしょうか？

if (!String.prototype.trimIt) { // prototype に trimIt プロパティがない場合に追加
String.prototype.trimIt = function() {
return this.replace(/^\s+|\s+$/g, ''); // 文字列前後のスペースを除去
}

Comments

[think49]

> javascriptを勉強中に下記の記述に出くわしたのですが、

質問を「編集」して、出くわしたWebページのURLを追記して下さい
https://ja.wikipedia.org/wiki/%E6%83%85%E5%A0%B1%E6%BA%90

[tanakashouzoux]

ご回答ありがとうございますm(__)m

実は上記記述は書籍に載っている部分をそのまま引用させて頂いたものでして、URLの追記は生憎出来ないんです。。。

[think49]

では、書籍名とページ番号/見出しを添えて、「引用」すると良いです。
https://ja.wikipedia.org/wiki/%E5%BC%95%E7%94%A8
http://akameco.hatenablog.com/entry/2015/01/31/035215

Answer 1

「String.prototype.trimIt」ですと「.」が2つありますし、何がどうなっているのかさっぱりわかりません。

上に書いたhoge.trimItと全く同じで、String.prototypeオブジェクトにtrimItというメソッドを追加しています。

そして、String.prototypeはすべての文字列オブジェクトから参照されますので、"hoge".trimIt()のようなことができるようになります。

ただし、このように「既存のオブジェクトのプロトタイプを拡張する」ことはプロトタイプ汚染とも呼ばれ、あまり好まれない手法です。

Comments

[tanakashouzoux]

いつもいつも本当にありがとうございますm(__)m

「hoge.trimIt」の様に「.」が1個だけではなく「String.prototype.trimIt」の様に「.」が2個ある場合は2個目の「.」の前まで、つまり今回ですと「String.prototype」をオブジェクトと考えるのでしょうか？

それともこの「String」「prototype」が特殊な何かなのでしょうか？

Answer 2

文字列リテラル

文字列リテラルはプロパティアクセス時にラッパーオブジェクト(String のインスタンス)に変換されます。
https://jsprimer.net/basic/wrapper-object/
https://jsprimer.net/basic/string/

プロトタイプオブジェクト

String のインスタンスは String.prototype にあるプロパティを扱えます。
https://jsprimer.net/basic/prototype-object/
仕組みの詳細はプロトタイプチェーンを調査して下さい。
https://jsprimer.net/basic/class/

Re: tanakashouzoux さん

Comments

[think49]

プロトタイプチェーンを追記しました。

[tanakashouzoux]

わざわざたくさん教えていただきありがとうございます！！！
今教えて頂いたサイトの方読んでおりました！！！

プロトタイプチェーンもっと調査したいと思いますm(__)m