JavaScript – call,apply,bind

call, apply, bind 是函數物件中設定 this 關鍵字的內建方法。

fn.call(this-obj, value1…)

call() 方法，可以用來改變 this 指向的物件，this-obj是 this 要指向的物件，value1…是要傳進函數的參數。

var myName = 'Louisa';

function tagName(a, b) {
    console.log(this.myName, a, b);
};

var family = {
    myName: 'Wei'
};

tagName(1, 2);  // Louisa 1 2
tagName.call(family, 1, 2);  // Wei 1 2

fn.apply(this-obj[, value1…])

apply() 跟 call() 的用途是一樣的，只是第二個參數是一個陣列。

var myName = 'Louisa';

function tagName(a, b) {
    console.log(this.myName, a, b);
};

var family = {
    myName: 'Wei'
};

tagName.apply(family, [5, 6, 7]);   // Wei 5 6

function re_tagName(a){
    console.log(this.myName, a, arguments);
}

re_tagName.apply(family, [5, 6, 7]);  // Wei 5 Arguments(3) [5, 6, 7]

fn.bind(this-obj[, value1…])

亦用來綁定 this 指向的方法，但call() 和 apply() 是直接執行function，bind() 是建立一個新的 function。

var myName = 'Louisa';

function tagName(a, b) {
    console.log(this.myName, a, b);
};

var family = {
    myName: 'Wei'
};

function re_tagName(a){
    console.log(this.myName, a, arguments);
}

var fn = tagName.bind(family, 8, 9);
fn();  // Wei 8 9

var fn2 = re_tagName.bind(family, 8, 9, 10);
fn2();  //  Wei 8 Arguments(3) [8, 9, 10]