web-dev-qa-db-ja.com

「オブジェクト」をJavaScriptの関数に変換する方法は?

JavaScriptを使用すると、関数をオブジェクトとして扱うことができます。最初に変数を関数として定義すると、後でその関数にプロパティを追加できます。どのように逆を行い、「オブジェクト」に関数を追加しますか?

これは機能します:

_var foo = function() { return 1; };
foo.baz = "qqqq";
_

この時点で、foo()は関数を呼び出し、_foo.baz_の値は「qqqq」です。

ただし、最初にプロパティの割り当て部分を実行する場合、その後、変数に関数をどのように割り当てますか?

_var bar = { baz: "qqqq" };
_

_bar.baz_が値 "qqqq" andbar()を持って関数を呼び出すように調整するには、どうすればよいですか?

37
mjs

ここで混乱するのは簡単ですが、(簡単に、明確に、または私が知る限り)あなたが望むことをすることはできません。うまくいけば、これは物事を片付けるのに役立つでしょう。

まず、JavascriptのすべてのオブジェクトはObjectオブジェクトから継承します。

//these do the same thing
var foo = new Object();
var bar = {};

次に、関数[〜#〜]はJavascriptの[〜#〜]オブジェクトです。具体的には、これらはFunctionオブジェクトです。 FunctionオブジェクトはObjectオブジェクトから継承します。チェックアウト 関数コンストラクター

var foo = new Function();
var bar = function(){};
function baz(){};

変数を「オブジェクト」として宣言すると、それを関数オブジェクトに変換することはできません(簡単に、明確に、または私が知る限り)。関数型の新しいオブジェクトを宣言し(関数コンストラクターを使用して、変数に無名関数を割り当てるなど)、古いオブジェクトからメソッドのプロパティをコピーする必要があります。

最後に、考えられる質問を予想して、何かが関数として宣言されたとしても、(私が知る限り)functionBody/sourceを変更することはできません。

27
Alan Storm

それを行うための標準的な方法はないようですが、これは機能します。

しかし、なぜそれが問題なのか。

function functionize( obj , func )
{ 
   out = func; 
   for( i in obj ){ out[i] = obj[i]; } ; 
   return out; 
}

x = { a: 1, b: 2 }; 
x = functionize( x , function(){ return "hello world"; } );
x()   ==> "hello world" 

これを達成する他の方法はありません。

x={}
x() 

「タイプエラー」を返します。 「x」は「オブジェクト」であり、変更できないためです。やろうとするのと同じくらい賢明です

 x = 1
 x[50] = 5
 print x[50] 

それは動作しません。 1は整数です。整数には配列メソッドがありません。あなたはそれを作ることはできません。

23
Kent Fredric

オブジェクトタイプは関数であり、オブジェクト自体は関数のインスタンス化です。

_alert([Array, Boolean, Date, Function, Number, Object, RegExp, String].join('\n\n'))
_

ディスプレイ(FireFox内):

_function Array() {
    [native code]
}

function Boolean() {
    [native code]
}

function Date() {
    [native code]
}

function Function() {
    [native code]
}

function Number() {
    [native code]
}

function Object() {
    [native code]
}

function RegExp() {
    [native code]
}

function String() {
    [native code]
}
_

特に、関数オブジェクトfunction Function() { [native code] }は、漸化式(それ自体を使用する再帰的定義)として定義されていることに注意してください。

また、 answer 124402#124402 は_1[50]=5_に関して不完全であることに注意してください。これは、プロパティをNumberオブジェクトに割り当て、IS有効なJavascriptです。観察してください、

_alert([
  [].prop="a",
  true.sna="fu",
  (new Date()).tar="fu",
  function(){}.fu="bar",
  123[40]=4,
  {}.forty=2,
  /(?:)/.forty2="life",
  "abc".def="ghi"
].join("\t"))
_

ディスプレイ

_a   fu  fu  bar 4   2   life    ghi
_

javascriptの「RulesofEngagement」に従って正しく解釈し、実行します。

もちろん、_=_によるシワやマニフェストは常にあります。多くの場合、オブジェクトは、変数に割り当てられたときに、本格的なエンティティではなく、その値に「短絡」されます。これは、ブールオブジェクトとブール値の問題です。

明示的なオブジェクトIDは、この問題を解決します。

_x=new Number(1);  x[50]=5;  alert(x[50]);
_

「オーバーロード」は非常に正当なJavascriptの演習であり、コードの難読化は危険な場合がありますが、prototypingのようなメカニズムで明示的に承認されています。

最後の注意:

_alert(  123 . x = "not"  );

alert( (123). x = "Yes!" );  /* ()'s elevate to full object status */
_
3
Ekim
var A = function(foo) {                                                                                                      
  var B = function() {                                                                                                       
    return A.prototype.constructor.apply(B, arguments);
  };
  B.prototype = A.prototype;                                                                                                 
  return B;                                                                                                                  
}; 
1
Daniel Wozniak

注意:私が問題を解決した方法で書かれた投稿。 OPの場合に使用できるかどうかは100%わかりません。

サーバー上で作成され、JSON/ajaxによってクライアントに配信されるオブジェクトを変換する方法を探しているときにこの投稿を見つけました。

これにより、クライアント上でインスタンスを作成できるように関数に変換したかったオブジェクトであるOPと同じ状況になりました。

結局、私はこれを思いついた、それは(少なくともこれまでのところ)機能している:

var parentObj = {}

parentObj.createFunc = function (model)
{
    // allow it to be instantiated
    parentObj[model._type] = function()
    {
        return (function (model)
        {
            // jQuery used to clone the model
            var that = $.extend(true, null, model);
            return that;
        })(model);
    }
}

その後、次のように使用できます。

var data = { _type: "Example", foo: "bar" };
parentObject.createFunc(data);
var instance = new parentObject.Example();

私の場合、実際には、結果のオブジェクトインスタンスに関連付けられた関数が必要であり、インスタンス化時にパラメータを渡すこともできます。

だから私のコードは:

var parentObj = {};
// base model contains client only stuff
parentObj.baseModel =
{
    parameter1: null,
    parameter2: null,
    parameterN: null, 
    func1: function ()
    {
        return this.parameter2;
    },
    func2: function (inParams) 
    {
        return this._variable2;
    }
}

// create a troop type
parentObj.createModel = function (data)
{
    var model = $.extend({}, parentObj.baseModel, data);
    // allow it to be instantiated
    parentObj[model._type] = function(parameter1, parameter2, parameterN)
    {
        return (function (model)
        {
            var that = $.extend(true, null, model);
            that.parameter1 = parameter1;
            that.parameter2 = parameter2;
            that.parameterN = parameterN;
            return that;
        })(model);
    }
}

そしてこう呼ばれた:

// models received from an AJAX call
var models = [
{ _type="Foo", _variable1: "FooVal", _variable2: "FooVal" },
{ _type="Bar", _variable1: "BarVal", _variable2: "BarVal" },
{ _type="FooBar", _variable1: "FooBarVal", _variable2: "FooBarVal" }
];

for(var i = 0; i < models.length; i++)
{
    parentObj.createFunc(models[i]);
}

そして、それらを使用することができます:

var test1 = new parentObj.Foo(1,2,3);
var test2 = new parentObj.Bar("a","b","c");
var test3 = new parentObj.FooBar("x","y","z");

// test1.parameter1 == 1
// test1._variable1 == "FooVal"
// test1.func1() == 2

// test2.parameter2 == "a"
// test2._variable2 == "BarVal"
// test2.func2() == "BarVal"

// etc
1
Morvael

一時変数を使用します。

var xxx = function()...

次に、元のオブジェクトからすべてのプロパティをコピーします。

for (var p in bar) { xxx[p] = bar[p]; }

最後に、古いプロパティを持つ新しい関数を元の変数に再割り当てします。

bar = xxx;
1
Avner

JavaScriptを使用すると、関数をオブジェクトとして扱うことができます。関数にプロパティを追加できます。どのように逆を行い、オブジェクトに関数を追加しますか?

あなたは少し混乱しているようです。 JavaScriptの関数は、areオブジェクトです。そして変数変数。これが機能するとは思わないでしょう:

var three = 3;
three = 4;
assert(three === 3);

...では、なぜ関数を変数に割り当てると、以前の値が何らかの形で保持されると期待するのでしょうか。おそらく、いくつかの注釈があなたのために物事を明確にするでしょう:

// assigns an anonymous function to the variable "foo"
var foo = function() { return 1; }; 
// assigns a string to the property "baz" on the object 
// referenced by "foo" (which, in this case, happens to be a function)
foo.baz = "qqqq";
0
Shog9