js call apply bind簡單的理解

qingyezhu發表於2015-10-25

相同點:JS中call與apply方法可以改變某個函式執行的上下文環境,也就是可以改變函式內this的指向。
區別:call與apply方法的引數中,第一個引數都是指定的上下文環境或者指定的物件,而call()方法傳入的引數都是不定的,而apply()方法傳入的引數都是放入陣列中才能傳入的。

bind()方法與call()和apply()方法很相似,都是可以改變函式內this的指向。

MDN的解釋是:bind()方法會建立一個新函式,稱為繫結函式,當呼叫這個繫結函式時,繫結函式會以建立它時傳入bind()方法的第一個引數作為this,傳入bind()方法的第二個以及以後的引數加上繫結函式執行時本省的引數按照順序作為原函式的引數來呼叫原函式。
如果只是想改變上下文環境,而非執行該函式,則使用bind()方法,call()或apply()方法會立即執行該函式。

Demo:

(function(){

  var obj = {
    id: 1,
    name: 'Object',
    show: function(){
      console.log('編號為:%d,姓名為:%s', this.id, this.name);
    }
  };
  
  obj.show();//編號為:1,姓名為:Object
  
  var lili = {
    id: 2,
    name: 'LiLi'
  };
  obj.show.call(lili);//編號為:2,姓名為:LiLi
  obj.show.apply(lili);//編號為:2,姓名為:LiLi
  obj.show.bind(lili)();//編號為:2,姓名為:LiLi

})();

應用:

(function(){

  var arr1 = [1, 3, 5, 7, 9];
  //最大值:
  console.log(Math.max.apply(null, arr1));//9
  //最小值:
  console.log(Math.min.apply(null, arr1));//1
  var arr2 = ['a', 'b', 'c', 'd'];
 
  
  //陣列追加
  Array.prototype.push.apply(arr1, arr2);
  console.log(arr1);// [1, 3, 5, 7, 9, "a", "b", "c", "d"]

})();

 

相關文章