web-dev-qa-db-ja.com

JavaScriptでカスタムオブジェクトのメソッドを作成するにはどうすればよいですか?

のような...

var obj = new Object();

obj.function1 = function(){
    //code
}

またはそのような何か?

50
MetaGuru
_var newObj = {
    met1 : function () {
        alert('hello');
    }
};
_

次に、メソッドは次のように呼び出すことができます。

_newObj.met1();
_

ところで、新しいオブジェクトを宣言するときは、new Object()コンストラクターではなく、オブジェクトリテラル(_{}_)を使用します。

53
Andreas Grech

回答から、すでに複数の方法があることがわかります。

#1
var o = new Object();
o.method = function(){}

#2
var o = new Object();
o.prototype.method = function(){}

#3
function myObject() {
    this.method = function(){}
}
var o = new myObject();

#4
function myObject() {}
myObject.prototype.method = function(){}
var o = new myObject();

#5
var o = {
    method: function(){}
}

#3と#4はコンストラクター関数を使用しています。これは、それらを使用して同じ「クラス」のオブジェクトを多数作成できることを意味します(クラスは実際にはJavaScriptには存在しません)

#4は#3とは異なります。これは、#4で構築されたすべてのオブジェクトがプロトタイプのプロパティであるため、同じ「メソッド」メソッドを共有するためです。これによりメモリが節約されますが(非常にわずかな量)、プロトタイプのメソッドを変更すると、すべての#4オブジェクトがすぐに更新されます(すでにインスタンス化されている場合でも)。

#1、#2、#5はすべてほぼ同等です。これは、おそらく一度に1つしか存在しないため、#2がプロトタイプに追加されたメソッドを持っているという事実は実際には重要ではないからです。 (クローン作成を考慮しない)

クロージャを持つファクトリを使用してオブジェクトにメソッドを追加する方法や、関数またはプライベートなネストされた関数に「静的な」プロパティ/メソッドを追加する方法はまだあります... :)

88
meouw

通常、 prototype プロパティを使用します。

function YourObject()
{
    //
}

YourObject.prototype.yourMethod= function()
{
   //
}

まだ誰も言及していないことの1つは、オブジェクトリテラル表記などでprototypeプロパティを使用する理由です。そうすることで、作成元のオブジェクトのすべてのインスタンスで関数定義が共有されるようになりますインスタンス化ごとに1回ではなく、関数のプロトタイプ。

13

心配しないで、ここにコードがあります:

  var myObj=function(){
      var value=null

     this.setValue=function(strValue){

     this.value=strValue;
     };

     this.getValue=function(){
     return this.value;
     };    
};

このオブジェクトは次のように呼び出すことができます。

    var obj= new myObj();
    obj.setValue("Hi!");
    alert(obj.getValue());
2
Ranjeet Rana

es6 を使用すると、次のようにできます。

var a = {
    func(){
        return 'The value';
    }
}
    
document.getElementById('out').innerHTML = a.func();
   
<div id="out"></div>
1
msangel

Function.prototype.implement = function(member, value) {
   this[member] = value;
   return this;
}

function MyFunction() {
 //...
}

(function($){

 $.implement("a", "blabla")
 .implement("b", function(){ /* some function */ })
 .implement("c" {a:'', b:''});

})(MyFunction);
1
Barry

「Object.create()」メソッドを使用する代わりに、次のこともできます。

関数呼び出し:

com.blah.MyChildObj.prototype = createObject(com.blah.MyParentObj.prototype, 
    com.blah.MyChildObj);

関数定義:

function createObject(theProto, theConst) {
    function x() {};
    x.prototype = theProto;
    x.prototype.constructor = theConst;
    return new x();
}
0
specialk1st