apply、call、bind

2206 ワード

apply、call、bindはJavaScriptの新米にとって他の言語では経験したことのない新しい概念かもしれません.この3つの方法の作用と違いを理解するには、他の状況でthisの値を先に理解しておく必要があります.この2つの文章を参照してください.
  • thisの値はいったい何ですか?一回ではっきり言います.
  • どうしてまだthisが分かりませんか?
  • Function.prototype.bind()fun.bind(thisArg[, arg1[, arg2[, ...]]])新しい関数を返します.新しい関数は、調整関数(バインディング関数のターゲット関数)と同じ関数を持ち、関数内部のthisを着信の最初のパラメータとして指定します.バインディング関数が呼び出された場合、bind()も事前設定のパラメータを元関数に提供します.thisArgは、バインディング関数が起動されると、このパラメータが元の関数として動作するときのthis方向を指す.newオペレータを使用してバインディング関数を呼び出すと、このパラメータは無効です.arg1, arg2, ...は、バインディング関数が起動されると、これらのパラメータを実際参照する前にバインディングされた方法に渡す.
    bind()の最も簡単な使い方は、関数を作成して、この関数をどのように呼び出しても同じthis値があるようにします.
    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
    
    参考:Function.prototype.bind()-JavaScript_MDN
    Function.prototype.apple()fun.apply(thisArg[, argsArray])thisArgは、fun関数の実行時に指定されたthis値です.指定されたthis値は必ずしもこの関数が実行された時の本当のthis値ではないので、この関数が非厳格モードの場合、nullまたはundefinedに指定されると、自動的にグローバルオブジェクト(ブラウザではwindowオブジェクト)を指し、元の開始値(数字、文字列、ブール値)のthisとして指定されます.は、元の値の自動包装の対象を指します.argsArrayの配列またはクラスの配列オブジェクトのうち、配列要素は個別のパラメータとしてfun関数に伝達される.ECMAScript 5からクラス配列オブジェクトが使用できます.例えば、クラスの配列オブジェクトargmentsに配列のjoin方法を呼び出す:
    function joinStr(){
      return Array.prototype.join.apply(arguments, ['-']);
    }
    joinStr('a', 'b', 'cc') // a-b-cc
    
    参考:Function.prototype.appy()-JavaScript_MDN
    Funtion.prototype.cal()
    apply()はcall()と非常に似ていますが、一つの違いだけがcall()メソッドが受け入れるのはいくつかのパラメータのリストです.fun.call(thisArg[, arg1[, arg2[, ...]]])thisArgは、fun関数の実行時に指定されたthis値です.特性はappyの最初のパラメータと同じです.arg1, arg2, ...で指定されたパラメータリストです.
    上記のappyの例はcallで実現すれば、パラメータフォーマットを変更すればいいです.
    function joinStr(){
      return Array.prototype.join.call(arguments, '-');
    }
    joinStr('a', 'b', 'cc') // a-b-cc
    
    参考:Function.prototype.call()-JavaScript|MDN