Edited at

JavaScriptでの継承 関数プロパティprototypeについて

More than 5 years have passed since last update.


前提

ホントに最近はJavaScriptについてたくさんのいい本が出ていますね。

私もいろいろ読ませて頂きましたが、私なりに掲題について一旦頭をまとめるために書きました。

いろいろ書き始めたら、いろいろがいろいろに絡み合って、あれもこれもとなってしまいました

なので、全部やめて、言葉足りないかもしれませんが、未来の自分にとってはこのくらいでまとめておきました。とりあえずです。


そんでindex.html書いた


index.html

<html>

<head>
<meta charset="utf-8">
</head>
<script type="text/javascript">

/////////ユーザ定義でコンストラクタ関数定義
function MyObj(){}
var obj1= new MyObj();

try{
obj1.echo("obj1のecho");
} catch(e) {
console.log("obj1のechoがない");
}

//prototypeプロパティにechoメソッドを追加
MyObj.prototype.echo = function(str){console.log(str);}
var obj2 = new MyObj();
try{
obj2.echo("obj2のecho");
} catch(e) {
console.log("obj2のechoがない");
}

//////////String(組み込みコンストラクタ関数)について
var str = new String();
try{
str.echo("strのecho");
} catch(e) {
console.log("strのechoがない");
}
//Stringのプロトタイプにechoメソッド追加
String.prototype.echo = function(str){console.log(str);};
var hogeStr = new String("");
hogeStr.echo("hogeStrのecho");

//こちらも実質Stringにechoが追加されてから"文字列"はインスタンス化されているのでOK
"文字列".echo("文字列のecho");

</script>
</html>



結果

ブラウザに貼り付けて、ブラウザのコンソール見ると下記の結果が出力されていますね。


結果

"obj1のechoがない" 

"obj2のecho"
"strのechoがない"
"hogeStrのecho"
"文字列のecho"