ホームページ  >  記事  >  ウェブフロントエンド  >  JavaScriptのbindメソッドのコード例

JavaScriptのbindメソッドのコード例

不言
不言転載
2019-03-11 16:27:342508ブラウズ

この記事では、JavaScript のバインド メソッドに関するコード例を紹介します。一定の参考値があります。困っている友人は参考にしてください。お役に立てば幸いです。

call、apply、new は以前に実装されました。ちなみに今日からバインドも実装されました。
まず第一に:

  1. bind メソッドは、これにバインドされた関数を返しますが、この関数は実行されず、手動で呼び出す必要があります。 (この観点から見ると、bind 関数は高階関数であり、call メソッドや apply メソッドとは異なります)。
  2. bind メソッドはこれをバインドしてパラメータを渡すことができます。このパラメータは複数回渡すことができることに注意してください。
  3. bind によってバインドされた関数が新しい場合、この時点で this ポインタが変更されます。現時点では、これが現在の関数のインスタンスです。
  4. コンストラクターのプロパティとメソッドは、各インスタンスで使用できます。

わかりました、上記のコード~

Function.prototype.mybind = function(context){
    let that = this;
    let args1 = Array.prototype.slice.call(arguments,1);
    let bindFn = function(){
        let args2 = Array.prototype.slice.call(arguments);
        return that.apply(this instanceof bindFn?this:context,args1.concat(args2)); 
    }
    let Fn = function(){};
    Fn.prototype = this.prototype;
    bindFn.prototype = new Fn();
    return bindFn;
}

まず、最初に渡されたパラメーター args1 を取得し、最初のパラメーターがこれであるため、ここでそれをインターセプトします。次に、関数bindFnが宣言され、2番目に渡されたパラメータargs2が取得され、その実行が返されます。ここでの「that」は元の関数です。元の関数を実行するときと、元の関数「this」をバインドするときの判断に注意してください。これがコンストラクター bindingFn new によって生成されたインスタンスである場合、ここではインスタンス自体である必要があります。逆に、bind メソッドで渡されるのは this(context) です。最後に、 concat() で 2 回取得したパラメータを接続して渡すことで、最初の 3 つの項目が実現されます。
最後の項目: コンストラクターのプロパティとメソッドは各インスタンスで使用できます。ここでは、中間関数 Fn を使用してプロトタイプ チェーンを接続します。 Fn の原型は this の原型と同じです。 Fn と this は同じプロトタイプ オブジェクトを指します。 bindFn のプロトタイプは Fn のインスタンスと同じです。 Fn インスタンスの __proto__ は、Fn のプロトタイプを指します。つまり、bindFn のプロトタイプは、これと同じプロトタイプを指し、同じプロトタイプ オブジェクトを指します。この時点で、独自のバインド メソッドが実装されました。
コードが書かれたので、テストしてみましょう~

Function.prototype.mybind = function(context){
それ = これであるとします。
args1 = Array.prototype.slice.call(arguments,1); とします。
bindFn = function(){ とします。
args2 = Array.prototype.slice.call(arguments); とします。
return that.apply(bindFn のインスタンス?this:context,args1.concat(args2));
}
Fn = function(){}; とします。
Fn.prototype = this.prototype;
bindFn.prototype = 新しい Fn();
バインドFnを返します。
}

obj = { にします
名前:「タイガー」
}

関数 fn(名前,年齢){
This.say = 'ワンワン~';
コンソール.ログ(これ);
Console.log(this.name '育てた人' 名前 ',' 年齢 '歳');
}

/**初めてパラメータを渡すとき*/
let bindingFn = fn.mybind(obj,'

以上がJavaScriptのbindメソッドのコード例の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事はsegmentfault.comで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。