2012-02-03 11 views
1

これが問題に関連している機能の両方でOOPの構文、およびオブジェクト:How to implement chained method calls like jQuery?JavaScriptのvarと私は以前ここに尋ね

私はそこにいくつかの時間からのチェックの回答からメソッドを使用している、そしてそれうまくいく。しかし私は私のツールキットの構文をさらに変更したいと思います。

  1. foo(firstarg).bar(secondarg); // should function as the question above.

  2. foo(onlyarg).bar // a function with one argument

  3. foo.bar(onlyarg); // should also work, when a first argument is not appropriate.

  4. foo.bar; // a function without an argument, or returns a static value.

私は同じことをオフに動作するようにすべての4 syntaxsをしたいと思いますfooオブジェクトですが、そうするためのOOPの理解が欠けています。私はいくつかのことを試してきましたが、今のところ私は働くには1 & 2を、そして働くには3 & 4を得ることができます。各関数にルートオブジェクトを返させることによって、連鎖がオプションのまま残っているといいでしょう。

編集:私は明確に、より具体的にする必要があり、ここで私が今持っているものです。私が望むものを

var main = function(obj){ this.obj = obj; }; 
var tool = function(obj){ return new main(obj); }; 
main.prototype = { 
     alertThisPlus : function(plus){ 
      alert(this.obj + ' ' + plus);  
     }, 
     alertJustThis : function(){ 
      return alert(this.obj); 
     } 
}; 

使い方

tool('hello').alertThisPlus('world'); // returns alert('hello world') 
tool().alertJustThis('hello world'); // returns alert('hello world'); 

はこれを行うことです。

tool('hello').alertThisPlus('world'); // returns alert('hello world') no change 
tool.alertJustThis('hello world'); // returns alert('hello world') does not work 
+0

これは本当にOOPではありませんが、ミュートポイントです。 3と4は 'bar'が関数でなければ非互換です。それらをコンパチブルにするためにできることは引数なしで 'bar'を呼び出すことです。 1と2と同様に –

+1

が正しい。私は既に1&2の作業をしており、3&4はすでに作業しています。一度にすべてがうまくいっています。私はjqueryの可能性があることを知っています:例えば$(arg).fooと$ .browserの両方が動作します。 – Fresheyeball

答えて

3

機能だけので、あなたが「道具」に機能を追加することができるオブジェクトです。

tool.foobar = function() {}; 

また、クラスが適切に構成されている場合は、ミックスインアプローチを使用することもできます。このようなもの:

function Tool(prefix) { 
    this.prefix = prefix; 
} 

Tool.prototype.alertThisPlus = function(suffix) { 
    alert((typeof this.prefix != 'undefined' ? this.prefix + ' ' : '') + suffix); 
}; 

Tool.prototype.alertJustThis = function(msg) { 
    alert(msg); 
}; 

function tool(prefix) { 
    return new Tool(prefix); 
} 

// Mix-in the methods from a static instance of Tool onto the 'tool' function. 
// This makes both tool.alertThisPlus() and tool.alertJustThis() available, 
// both will be called in the context of 'staticTool'. 
(function() { 
    var staticTool = new Tool(); 
    for (var o in staticTool) { 
    if (typeof staticTool[o] == 'function') { 
     tool[o] = staticTool[o].bind(staticTool); 
    } 
    } 
})(); 

tool('hello').alertThisPlus('world'); // returns alert('hello world') 
tool().alertJustThis('hello world'); // returns alert('hello world') 
tool.alertJustThis('hello world'); // returns alert('hello world') 
+0

'Function.bind()'はすべてのブラウザでサポートされているわけではありませんので、クロージャを使用するか、独自のバインド関数を記述する必要があります。 – Dan

+0

私はこの部分以外のすべてを理解しています:{ var staticTool = new Tool(); if(staticofoolのタイプ== 'function'){ ツール] = staticTool [o] .bind(staticTool); } } })(); – Fresheyeball

+0

ここで何が起こっているのか説明できますか? – Fresheyeball

0

私が考えることができる唯一の方法は、あなたがカッコで囲まずに関数を実行できるようにすることです。 ack param、またはb)それが自己実行するようにします。

これをさらに進めると、いくつかのクロージャを使用して値を返すことができます。

var foo = (function() { 
    return { 
    bar: "arf arf said the dog" 
    } 
})(); 

は今、あなたは使用することができます。

foo.bar;