ホームページ >ウェブフロントエンド >jsチュートリアル >JS_javascript スキルの適用、呼び出し、バインドの詳細な分析
JavaScript では、Function はオブジェクトです。 Function オブジェクトの this ポインターは、関数の呼び出し方法によって異なります。 apply、call、bind を使用すると、関数オブジェクト内の this のポインタをすべて変更できます。違いについて説明する前に、3 つの類似点をまとめてみましょう。
1. これらはすべて、関数のこのオブジェクトのポイントを変更するために使用されます。
2. 最初のパラメータは、これが指すオブジェクトです。
3. 後続のパラメータを使用してパラメータを渡すことができます。
呼び出しメソッド:
構文: call([thisObj[,arg1[, arg2[, [,.argN]]]]])
定義: オブジェクトのメソッドを呼び出して、現在のオブジェクトを別のオブジェクトに置き換えます。
説明: call メソッドを使用すると、別のオブジェクトの代わりにメソッドを呼び出すことができます。 call メソッドは、関数のオブジェクト コンテキストを初期コンテキストから thisObj で指定された新しいオブジェクトに変更します。
thisObj パラメータが指定されていない場合は、グローバル オブジェクトが thisObj として使用されます。
適用:
構文: apply(thisObj, 配列パラメーター)
定義: オブジェクトのメソッドを適用し、現在のオブジェクトを別のオブジェクトに置き換えます
注: パラメータが配列型でない場合は、TypeError が報告されます。
バインド:
bind と呼ばれるメソッドが EcmaScript5 で拡張されました (IE6、7、および 8 ではサポートされていません)。bind は call と非常によく似ています。たとえば、受け入れられるパラメーターは 2 つの部分に分割され、最初のパラメーターは次のように使用されます。実行 関数コンテキストにおける this のオブジェクト。 2 つの違いがあります:
①bindの戻り値は関数である; ②その後のパラメータの使い方も異なる;
function add(a, b) { alert(a + b); } function sub(a, b) { alert(a - b); }
add.call(sub,3,1);結果は 4
add.apply(sub,[3,1]);結果は 4
add.bind(sub)(3,1); 結果は 4
です。
出力結果は同じですが、渡すパラメーターの使用法が異なることがわかります。
例 2 を見てください:
function jone(name,age,work){ this.name=name; this.age=age; this.work=work; this.say=function(msg){ alert(msg+",我叫"+this.name+",我今年"+this.age+"岁,我是"+this.work) } } var jack={ name:"jack", age:'24', work:"学生" } var pet=new jone(); pet.say.apply(jack,["欢迎您"]) console.log(this.name)通話するには、次のものが必要です:
適用するには、これが必要です:
pet.say.apply(jack,["ようこそ!"])
バインドするには、これが必要です:
pet.say.bind(jack,"ようこそ")()
このとき、console.log(this.name) が出力され、this.name が jack となり、this のコンテキストが変更されていることが分かります。
上記の JS の apply、call、bind の詳細な分析は、エディターによって共有されたすべての内容です。参考にしていただければ幸いです。また、Script Home をサポートしていただければ幸いです。