LoginSignup
5
5

More than 5 years have passed since last update.

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

Last updated at Posted at 2014-04-30

前提

ホントに最近は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"     
5
5
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
5
5