JavaScriptにおけるapple()、call()とbind()方法の使用

7609 ワード

apply()とcall()
コール()とappy()をあるオブジェクトと見なす方法で、この方法を呼び出して関数を簡単に呼び出すことができます.call()とappy()の2つの方法は実際にはあまり違いません.方法の2番目のパラメータの種類に違いがあります.call()の2番目のパラメータは一連のパラメータです.
f.call(obj,1,2,...);
f.apply(obj,[1,2,...]);
これはこの2つの方法のパラメータの違いです.彼らは最初のパラメータで文脈を呼び出して、多くの友達が文脈を理解していないと思いますが、実はこれも私が読んだ本の中でこう言いました.いくつかの例を紹介して説明します.
    function Person(name, age) {
        this.name = name;
        this.age = age;
   }
    Person.prototype.showName = function() {
        console.log('Person showName -' + this.name);
    };
    Person.prototype.setName = function(name) {
        this.name = name;
        console.log('setName-' + name);
    };
    Person.prototype.showAge = function() {
        console.log('Person showAge - ' + this.age)
    };

    function Women(name,age) {
        Person.call(this,[name,age]);//this Women    Person     
        this.sex = 'male';
    }
    Women.prototype = Person.prototype;
    Women.prototype.showSex = function() {
        console.log('Women showSex-' + this.sex)
    };
    Women.prototype.showName = function() {
        console.log('Women showName - ' + this.name);
    };

    var women = new Women('cyl', 22);
    women.showName();
    women.showSex();
    women.setName('sf');//    this.name   Person.setName()   
    women.showName();
    //Women showName - cyl,22
    //Women showSex-male
    //setName-aaa
    //Women showName - sf
//   o   m()           
//                     
function trace(o, m){
    var original = 0[m];      //          
    o[m] = function(){       //      
        console.log(new Date(), "Entering:", m);//      
        var result = original.apply(this, arguments);//      
        console.log(new Date(), "Exiting:", m);
        return result;
    };
}
trance関数は、2つのパラメータ、1つのオブジェクト、および1つの方法名を受信し、指定された方法を新しい方法に置き換えます.この新しい方法は「小包」の元の方法の別の汎関数です.このような動的な修正方法は、時には「mokey-patch」ともなる.
bind()方法という方法の主な役割は、関数をあるオブジェクトに結びつけることであり、一つの関数がbind()メソッドを呼び出したら新しい関数を返すことである.例をあげましょう
function f(y){return this.x + y;}   //         
var o = {x: 1};             //       
var g = f.bind(o);          //    g(x)     o.f(x)
g(2);   // => 3
このバインディングは以下のコードによって容易に実現できる.
//      ,        o    f()
//       
function bind(f, o){
    if(f.bind) return f.bind(o);//  bind        bind  
    else return function(){
        return f.apply(o,arguments);
    }
}
もちろん、bind()メソッドは、関数を一つのオブジェクトに結びつけるだけでなく、他のアプリケーションも付属しています.最初の参加者以外にも、入力bind()の実参は値thisをバインドしています.この歌に付随するアプリケーションは、一般的な関数式プログラミング技術であり、「コリゼーション」とも呼ばれることがあります.以下の例の方法の実現を参照してください.
    var sum = function(x, y) {
        //         
        return x+y;
    }
    //      sum    ,  this     null
    //          1,                
    var succ = sum.bind(null, 1);
    succ(2)    //  =>3     x     1,   2    

    function f(y, z) {
        return this.x + y+ z;
    }
    var g = f.bind({x:1},2);
    g(3) //  =>6     this.x    {x:1}.x =1   y   2, z  3