前書き
bind() は無数のパラメーターを受け入れます。最初のパラメーターは、生成される新しい関数の this ポイントです。たとえば、ウィンドウを渡す場合、どこで呼び出されても、この新しい関数の this は を指します。新しい関数のパラメータは、bind() の 2 番目、3 番目、4 番目...n 番目のパラメータとその元のパラメータです。 (わかりました、私自身混乱しています)
例の紹介
栗を見ると理解しやすいです。bind() を使用する最も基本的な方法を見てみましょう:
this.x = 9; var module = { x: 81, getX: function() { return this.x; } }; module.getX(); // 返回 81 var retrieveX = module.getX; retrieveX(); // 返回 9, 在这种情况下,"this"指向全局作用域 // 创建一个新函数,将"this"绑定到module对象 // 新手可能会被全局的x变量和module里的属性x所迷惑 var boundGetX = retrieveX.bind(module); boundGetX(); // 返回 81
ここでは、ウィンドウの下でそれを呼び出していることが明らかです。 objectretrieveX の場合、結果は window の下の x になるはずです。モジュール オブジェクトをretrieveX の this にバインドすると、どこで呼び出されても、this はモジュール オブジェクトを指します。
bind() には他にもパラメータがあります。初めてbind() に触れる友人は、上記の定義を見たときに混乱すると思います。
例を挙げてみましょう:
function list() { return Array.prototype.slice.call(arguments); } var list1 = list(1, 2, 3); // [1, 2, 3] // 创建一个拥有预设初始参数的函数 var leadingThirtysevenList = list.bind(undefined,[69,37],{a:2}); var list2 = leadingThirtysevenList(); // [[69,37],{a:2}] var list3 = leadingThirtysevenList(1, 2, 3); // [[69,37],{a:2}, 1, 2, 3]
list 関数は非常に単純で、渡された各パラメーターを配列に挿入します。これは、リスト関数の初期値を設定するために使用します。リスト内のこのポインタを直接渡すので、2番目のパラメータから始めて、list2とlist3の戻り値ですべてを説明する必要があります。
私が通常、bind() を使用するシナリオは、setTimeout 関数と連携することです。これは、setTimeout を実行するときに、デフォルトで window オブジェクトを指すためです。bind() を使用する前に、次のことを行います。関数内でこれをキャッシュするポインターを定義します。これにより、どのように呼び出されても、Coder のインスタンスを指すようになります。しかし、もう 1 つ変数を定義するのは常に面倒です。
bind() を使用する方がはるかに簡単です。
function Coder(name) { var that = this; that.name = name; that.getName = function() { console.log(that.name) }; that.delayGetName = function() { setTimeout(that.getName,1000) }; } var me = new Coder('Jins') me.delayGetName()//延迟一秒输出Jins
これで、setTimeout の this を外側の this に直接バインドできます。
Function の binding() の例の詳細な説明については、PHP 中国語 Web サイトに注目してください。