• 締切済み

prototype の使い方

prototype プロパティについて勉強しているのですが、次のような使い方で正しいのでしょうか。 var Dog = function() { this.sit = "I am sitting."; } var myDog = new Dog(); alert(myDog.sit); //“I am sitting.”と表示される。 var Dog2 = function() {} Dog2.prototype.sit = new Dog().sit; var myDog2 = new Dog2(); alert(myDog2.sit); //“I am sitting.”と表示される。 prototype の行で new Dog() を作るとゴミが出る気がするのですが、勝手に解放されるのでしょうか。

みんなの回答

  • haraga
  • ベストアンサー率56% (36/64)
回答No.2

No1です それでは下記は違いますね プロパティの継承で調べてみましたか?

KanjiTalk
質問者

お礼

色々調べたところ、なんとか使い方が分かりました。ありがとうございました。

  • haraga
  • ベストアンサー率56% (36/64)
回答No.1

dog = function() { this.str = "I am sitting."; } dog.prototype.sit=function{ alert(this.str); }; var myDog = new Dog(); mydog.sit(); これをいじくってくれ(動けばいいけど)

KanjiTalk
質問者

補足

えっと、継承型の言語でいうところの、DogクラスからDog2クラスへのsitプロパティの継承みたいなことをしたいのですが。myDogとmyDog2はインスタンスのつもりです。

関連するQ&A

  • prototypeで前の値を潰さない方法は?

    function obj() { this.name = "名前です"; } var obj01 = new obj(); alert(obj.name); というコードの場合、obj.nameでobj関数に設定されたnameプロパティの値「名前です」をアラートすることができます。このobj関数を変更せず、あとからプロパティと値を追加したい場合、prototypeメソッド(って言って間違いありませんか?)を用いて以下のように実現することができます。 function obj() { this.name = "名前です"; } obj.prototype.age = "年齢です"; var obj01 = new obj(); alert(obj.name+" / "+obj.age); newする前に記述するのがポイントなんですよね。これにより、obj関数(オブジェクト)にageというプロパティと値「年齢です」が追加され、アラートできるようになりました。また最近、連想配列を使うことで複数のプロパティと値を一気にセットできる便利な方法を発見しました。 function obj() { this.name = "名前です"; } obj.prototype.age = "年齢です"; obj.prototype = { "country":"日本出身です", "city":"東京出身です", "hobby":"音楽鑑賞です" }; var obj01 = new obj(); alert(obj.country+" / "+obj.city+" / "+obj.hobby); //alert(obj.age); //alert(obj.name); と、このように複数のプロパティと値をセットし、後で利用することができます。 前置きが長くてすみません、ここからが質問です。 最後の例の場合、連想配列によってセットされたプロパティの値は存在しますが、それ以前にprototypeで設定したageプロパティは存在しなくなっています。alert(obj.age)の行をコメントアウトしていますが、実行するとundefinedと表示されます。そして2つ目のコメントアウト行alert(obj.name);は問題なくnameプロパティの値をアラートできています。 つまり、prototypeメソッドを使って先に追加したプロパティと値は、「obj.prototype=連想配列」で実行した時点で潰されてしまっているようでした。 この連想配列を使ったプロパティ追加を行う際、先に「obj.prototype.プロパティ名」で追加していたプロパティと値を残しておく方法はありませんでしょうか?

  • コンストラクタとプロトタイプについて

    ネットで検索したりして調べているのですがいまいちわからなかった箇所が あるので質問させていただきます。 コンストラクタで設定するのとプロトタイプで設定する違いがいまいちわかりません。 例えば function Test { this.prop = hoge; } Test.prototype.prop1 = hogehoge; の場合 コンストラクタのほうが優先されてhogeがでるのはわかるのですが 下記の場合はプロタイプのほうが優先されてhogehogeと出てしまうのは どうしてでしょうか? <script language="javascript"> <!-- //コンストラクタ function Test(){alert("hoge"); } //prototypeでセット Test.prototype=alert("hogehoge"); //オブジェクト作成 var TEST = new Test(); window.onload=TEST; --> </script>

  • prototypeに二つ以上の暗黙の参照を持たせることはできない?

    var NAMESS = {   org:{ } } NAMESS.org = {   clsFoo : function( ){     this.foo = function( ){       alert("foo");     }   }   ,clsBar : function( ){     this.bar = function( ){       alert("bar");     }   }   ,clsHoge : function( ){ } } NAMESS.org.clsHoge.prototype = new NAMESS.org.clsFoo( ); NAMESS.org.clsHoge.prototype = new NAMESS.org.clsBar( ); 上記コードではclsHogeはclsBarのみ継承し、clsFooを継承できません。(代入しているので当たり前かもですが‥) これを NAMESS.org.clsHoge.prototype.foo = new NAMESS.org.clsFoo( ); NAMESS.org.clsHoge.prototype.bar = new NAMESS.org.clsBar( ); というようにする方法は知ってはいますが、 できればfooとbar両方を暗黙の参照にしたいと考えています。 JavaScriptでは二つ以上の継承はできないのでしょうか? よろしくお願いします。

  • prototypeという予約後について

    prototype プロトタイプ・キーワード。オブジェクトにプロパティを追加するときに使用する。 とのことですが、以下の2つは異なるのでしょうか? (1)---------------- var M = function(){}; M.val = 1; ------------------- (2)---------------- var M = function(){}; M.prototype.val = 1; ------------------- どう違うのかヒントください。

  • JavaScript プロトタイプについて

    ●質問の主旨 下記のコードを書くとエラーとして、 TypeError: Cannot set property 'totalPrice' of undefined が返されます。なぜでしょうか?原因が分かりません。 個人的には、このコードで、totalPriceメソッドを定義しているつもりなのですが…。 お詳しい方がいらっしゃいましたら、ご教示願います。 ●コード function Menu(name, price) { this.name = name; this.price = price; } var hamburger = new Menu("ハンバーガー", 100); hamburger.prototype.totalPrice = function(quantity) { return this.price * quantity; } var cheeseburger = new Menu("チーズバーガー", 120); cheeseburger.prototype.totalPrice = function(quantity) { return this.price * quantity; } output("太郎は、" + hamburger.name + "を" + hamburger.totalPrice(5) + "円分買いました。"); output("二郎は、" + cheeseburger.name + "を" + cheeseburger.totalPrice(3) + "円分買いました。"); ●元ネタ CodeStudy Javascript 4.プロトタイプ その3 http://jeek.jp/study/section21/4

  • prototype宣言によるメソッドと、プロパティを区別

    Array.prototype.myInclude = function(){ } というように配列にメソッドを追加しました。この上で hoge = new Array(); hoge["mikan"] = "orange"; hoge["ringo"] = "red"; for( var i in hoge ){ alert( i ); } とすると、 myInclude orange red と始めに追加したメソッドまで拾ってしまいます。 既にいくつかprototypeで書いてしまいました。 for~inの部分の書き換えでできる方法は無いでしょうか。

  • newでコンストラクタ関数が受け取った引数の行き先

    ・Test1とTest2で何が違うのでしょうか? ・Test1のtenは、this.scoreで生成するインスタンスプロパティへ格納 ・Test2のtenは、どうなっているのでしょうか? ・どこへも格納していないのに、「new Test2('100');」で文が終わった後、呼び出せている理由は? ■Test1 var Test1 = function (ten) {  this.score = ten;  this.getScore = function() {   alert(this.score);  } } var result1 = new Test1('100'); result1.getScore(); ■Test2 var Test2 = function (ten) {  this.getScore = function() {   alert(ten);  } } var result2 = new Test2('100'); result2.getScore(); ■下記★部分の「alert(this.score);」「alert(ten);」何れも100と表示されるのですが、中でどういう処理が走ってそういう結果になるのでしょうか? var Test3 = function (ten) {  this.score = ten;  this.getScore = function() { //★  alert(this.score);   alert(ten); } } var test3 = new Test3('100'); test3.getScore();

  • プロトタイプの関数から、別のプロトタイプの関数を呼出すには?

    javascript初心者ですが、オブジェクトに関してわからないことがあるので、教えてください。(とんちんかんな質問かもしれませんが、ご容赦下さい。) 下記のような場合、関数calから関数setを呼出すのはどうすればよいのでしょうか? function Obj(){ } Obj.prototype.set = function(){ } Obj.prototype.cal = function(){ ここから、setを呼出すにはどうすればよいのでしょうか? } var obj = new Obj();

  • prototype.jsを利用したイベントの登録について

    はじめまして。 現在 prototype.js 1.4.0 を利用して、Web ページの作成を行っているのですが、イベントの登録 (Event.observe)でやりたいことと、異なる動作になってしまい困っているところです。 [ やりたいこと ] javascript側で動的に生成した各要素 (div) に対して moueover & mouseout のイベントを割り当てる。mouseover 時には background の値を変え mouseout 時には background の値を元(transparent)に戻す。 [ 困っていること ] 各要素のmouseover & mouseout 時には各要素の背景色が変更されるはずなのに、一番最後に生成した要素の背景が変更されてしまう。 [ コード ] <html> <head> <script type="text/javascript" src="prototype.js" ></script> <script type="text/javascript"> view = new Class.create(); view.prototype = { initialize:function() { var view = $('viewContents'); var idName = 'test'; for (var i=0; i<10; i++) { var id = idName + i; var d = document.createElement('div'); d.id = id; d.innerHTML = id; view.appendChild(d); Event.observe(d,'mouseover',function() {d.style.background='#aaa';}.bind(this),false); Event.observe(d,'mouseout' ,function() {d.style.background='transparent';}.bind(this),false); Event.observe(d,'click' ,function() {alert(d.id);}.bind(this),false); } } } </script> </head> <body> <p><input type="button" onclick="new view();" value="取得"></p> <div id="viewContents"></div> </body> </html> となります。 なにか基本的なところが間違っているのでしょうか? よろしくお願いいたします。

  • 【javascript文法】 prototype.js Ajax.Request onSuccess:に指定するfancitonの書き方

    以下HTMLは開いた時に'2'がアラート、続いて'hello world'がアラートされるものです。 動作的には期待どおりに動きますが、記述方法に難を感じています。 課題としては、Ajax.RequestのonSuccess:に指定するfancrionをprototypeを使って 宣言したfunctionで且つ、引数を与えたいです。 (Ajax.Requestが返してくる引数も使いたい。) 表現が下手ですみません。 ※行頭は全角スペースです。実際に機能させる為には  半角に修正もしくは行頭スペースは削除して下さい。 <html> <head> <script type="text/javascript" src="prototype.js"></script> <script type="text/javascript"><!-- function http(){  this.val=1; }; http.prototype.request = function(){  var url="/ruby/hello.cgi"; //実際に検証する為にはwebサーバにこのcgiを置く必要あり  new Ajax.Request(url, {   method:"get",   onSuccess: function(h){r.processRequest(h,1);}   /* ↑http.prototype.requestの中なので、r.ではなくthis.processRequest(h,1)と記述したい*/  }); }; http.prototype.processRequest = function(h,arg){  alert(this.val+arg);  alert(h.responseText); }; var r = new http(); r.request(); //--></script> </head> <body></body> </html> 以下"/ruby/hello.cgi"の例 #!/usr/bin/ruby puts "Content-Type: text/html\n\n" puts "hello world" ※実際に実行する場合はprototype.jsが必要です。 これで、期待通りの結果が得られるのですが、コメントに記載したように、 http.prototype.request = function()の中でonSuccess:に指定する関数が、 this.と記述できず、r.と記述しないと動作しません。 http.prototype.request = function()の中で、 ~~~~~~~~~~~~~~ http.prototype.processRequest = function(h,arg) ~~~~~~~~~~~~~~ を使うのですから、 r.processRequest(h,1)ではなく、 ~ this.processRequest(h,1) ~~~~ と記述したいです。 因みに同じような質問を http://oshiete1.goo.ne.jp/qa4663141.html でしており、この『応用』だとも思うのですが、名案浮かばずです。 このような場合、どう記述するのがベターなのでしょうか? よろしくお願いいたします。

    • ベストアンサー
    • AJAX