単純な例での呼び出し、適用、バインドの比較簡単な例での比較

Question

この質問は、通常のIIFEファンクションリターンでこれを簡単に行う方法を比較するのではなく、3つの方法によるリターンを比較します。

この簡単な例は、スコープバインディングメソッド、viz-call、apply、およびbindとの結果の比較を示しています。

スニペット：

function printName() { 
 
    return this.name; 
 
} 
 

 
var obj1 = { name: 'Peter' }; 
 
var obj2 = { name: 'John'}; 
 
var obj3 = { name: 'Richard' }; 
 

 
var result1 = printName.call(obj1); 
 
var result2 = printName.apply(obj2); 
 
var result3 = printName.bind(obj3); 
 

 
console.log(result1); 
 
console.log(result2); 
 
console.log(result3);

結果：

問合せ：

1. 第3のケースで「リチャード」という結果を得るためにプログラムにどのような変更が加えられましたか？
2. 第1および第2のケースと同じことを呼び出して適用する場合、適用されるバインドの重要性は何ですか。
3. たとえバインドリターン関数であっても、コンソールで関数がobj3とこの関数をいくつかバインディングしてはいけません（引数としてobj3に似ています）？

Answer 1

3つすべての結果変数は参照関数なので、これらの変数は関数そのものです。バインドメソッドを使用する場合、callおよびapplyメソッドは即座に実行されますが、実際に実行されるprintName関数を割り当てることになります。 result3から返された "Richard"を取得するには、次のような関数として呼び出すだけです：result3（）; result1（）またはresult2（）を同じ方法で実行しようとすると、それらのメソッドがその場で適用され、ファクトの後に関数として使用できないため、エラーが表示されます。

この行が読み込まれます。

var result1 = printName.call(obj1); 

を...その後のprintName機能がすぐに実行され、その関数から返された値は、結果1に割り当てられます。 result2と同じです。

var result3 = printName.bind(obj3); 

...その後、機能自体はresult3するために割り当てられているので、電話して適用を取得するために使用されている

result3(); 

を入力して実行することができます：この行が読み込まれ

戻り値は返されますが、bindは関数の取得に使用されます。

THISキーワードに対するオブジェクトやプロトタイプメソッド内の参照がないため、再定義されたTHISコンテキストを渡す必要はありません。 CallメソッドとApplyメソッドは、別のオブジェクトに属するメソッドのコンテキストを変更する必要がある場合に最適です。OBJ1に新しいメソッドを追加するこの拡張例を見てください：

obj1.sayHello = function() { 
    console.log('Hello ' + this.name); 
} 

obj1.sayHello() //returns "Hello Peter" 

あなたがOBJ2からのデータを表示するOBJ1の内部でsayHelloメソッドを使用する場合は、電話を使用するか、次のように適用することができる場所、そのです：

obj1.sayHello.call(obj2); //returns "Hello John" 

呼び出しと適用の大きな違いは、別のオブジェクトに存在する関数にパラメータを渡す場合です。 obH1のsayHelloメソッドを次のように変更した場合：

obj1.sayHello = function(greeting) { 
    console.log(greeting + ' ' + this.name); 
}; 

sayHello関数はパラメータを受け入れるようになりました。もう一度あなたはこのような関数を呼び出す場合：

obj1.sayHello('Welcome'); //returns Welcome Peter 

いますが、obj2の上でこのメソッドを使用する場合、あなたはこのようにそれを行うだろう：

あなたはcallメソッドを使用し

obj1.sayHello.call(obj2, 'Greetings'); //returns Greetings John 

、あなたコンマ区切りの文字列を使用してパラメータを渡すことができます。

obj1.sayHello.apply(obj2, ['Happy Hump Day']); //returns Happy Hump Day John 

私はこれがあなたのためにそれをクリアするのに役立ちます願っています：また、あなたは、このようなパラメータとして値の配列を渡す必要があるだろうことを除いて、これと同じように適用することができます。

乾杯、 ジム