ホームページ >ウェブフロントエンド >jsチュートリアル >JavaScriptにおける連鎖呼び出しに関する研究
メソッドチェーンは一般に、オブジェクトに対する連続操作 (1 行のコードに集中) に適しています。コード量はある程度削減できますが、関数の戻り値を占有してしまうのがデメリットです。
1. オブジェクトチェーン: メソッド本体はオブジェクトインスタンスそのもの (this) を返します。
04 this.prop3 = null; 05 } 06 ClassA.prototype = { 07 method1 : function(p1){ 08 this.prop1 = p1; 10 }, 11 メソッド 2: function(p2){ 12 this.prop2 = p2; 13 return this; 14 }, 15 メソッド 3: function(p3){16 This.prop3 = p3;17 return this;
18 }
19 }
は関数/クラス ClassA を定義します。 prop1、prop2、prop3 という 3 つの属性/フィールドがあり、3 つのメソッド method1、method2、method3 がそれぞれ prop1、prop2、prop3 を設定します。
呼び出しは次のとおりです: view sourceprint?1 var obj = new ClassA(); 2 obj.method1(1).method2(2).method(3); // obj -> ,prop2= 2, prop3=3このように、ClassAのN個のメソッドが定義されている限り、objが連続して操作されていることがわかります。
このメソッドの欠点は、チェーン メソッドが 1 つのオブジェクト タイプ (ClaaaA) に一意にバインドされることです。この方法でチェーン操作を実装するには、クラスが定義されるたびに、これをメソッド本体で返す必要があります。 2 番目の方法でこの問題を解決できます。
02 * チェーンライトバージョン
03 * @param {Object} obj
04*/
05 functionchain(obj){
06 return function (){
07 var Self = argument.callee; Self.obj = obj;
08 if(arguments.length==0){
09 return Self.obj }
11 Self.obj [arguments[ 0]].Apply (Self.obj, [].Slice.call (ARGUMENTS, 1)); = null;
20 this.prop3 = null;
22 ClassB.prototype = {
23 メソッド1 : function(p1){
24 this.prop1 = p1; 26 メソッド 2 : function(p2){
27 this.prop2 = p2 }、
29 メソッド 3 : function(p3){
30 this.prop3 = p3 }
32 }
これは ClassB のメソッド 1、メソッド 2、およびメソッド 3 では返されなくなったことに注意してください。
呼び出しは次のとおりです: view sourceprint?1 var obj = new ClassB(); 2chain(obj)(method1,4)(method2,5)(method3,6); // obj -> prop1=4 ,prop2=5,prop3=6最初のメソッドは、3 回の呼び出し後にオブジェクト自体を返します。ここでは、空の "()" を使用してオブジェクトを取得します
view sourceprint?1 // result -> ; prop1=4 ,prop2=5,prop3=6
2 var result =chain(obj)(method1,4)(method2,5)(method3,6)();
このようにクラスを書くと、メソッド body でこれを返す必要はなく、任意のオブジェクトに対してチェーン呼び出しを行うことができます。
2 つの呼び出しメソッド:
view sourceprint?01 obj
02 .method1(arg1)
03 .method2(arg2)
04 .method3(arg3)
05 ...
06
07 チェーン(obj)
08 (method1,arg1)
09 (method2,arg2)
10 (method3,arg3)
11 ...