依據一道題激發的call、apply、bind要領總結

2019年8月24日 159次阅读 来源: qqqq

這是一道本日碰到的面試題

《依據一道題激發的call、apply、bind要領總結》

由於setTimeout屬於匿名函數,this指向window,所以this.id = 1
但照樣先總結一下call和apply的用法。

起首引見一下call和apply的定義

obj.call(thisObj, arg1, arg2,…)

obj.apply(thisObj, [arg1, arg2,…])

call和apply的作用是轉變函數運行時的上下文環境(轉變this的指向),將obj綁定到thisObj,或者說this.Obj挪用了obj內里的要領。

call和apply的作用

當一個對象須要挪用別的一個對象內里的要領的時刻,能夠用到call和apply,call和apply能夠明白成是繼續別的一個對象的要領。

起首我們豎立兩個對象obj1和obj2

《依據一道題激發的call、apply、bind要領總結》

假如obj2對象要挪用obj1中的func1要領(能夠明白為在obj2的環境中實行obj1.func1要領)，則

 obj1.func1.call(obj2); //輸出：obj2Name
 obj1.func1.apply(obj2);//輸出：obj2Name

call和apply第一個參數都是示意obj1綁定的對象，假如obj1要綁定到this，此時obj1就是綁定到全局，如：

 obj1.func1.call(this);//輸出：windowName
 obj1.func1.apply(this);//輸出：windowName

假如obj2對象要挪用obj1中的func2要領，則

  obj1.func2.call(obj2,1,2);//輸出：3
  obj1.func2.apply(obj2,[1,2]);//輸出：3

call和apply完成繼續

運用call要領挪用父組織函數

function Product(name, price) {
  this.name = name;
  this.price = price;

  if (price < 0) {
    throw RangeError(
      'Cannot create product ' + this.name + ' with a negative price'
    );
  }
}

function Food(name, price) {
  Product.call(this, name, price);
  this.category = 'food';
}

//等同於
function Food(name, price) {
  this.name = name;
  this.price = price;
  if (price < 0) {
    throw RangeError(
      'Cannot create product ' + this.name + ' with a negative price'
    );
  }

  this.category = 'food';
}

//function Toy 同上
function Toy(name, price) {
  Product.call(this, name, price);
  this.category = 'toy';
}

var cheese = new Food('feta', 5);
var fun = new Toy('robot', 40);

bind要領和call、apply的區分

bind要領也是用來轉變this的指向

var a = {
    user:"追夢子",
    fn:function(){
        console.log(this.user);
    }
}
var b = a.fn;
b.bind(a);

沒有被打印,這就是bind要領與apply、call要領的差別。bind要領返回的是修正事後的函數

var a = {
    user:"追夢子",
    fn:function(){
        console.log(this.user); //追夢子
    }
}
var b = a.fn;
var c = b.bind(a);
c();

實行勝利

    原文作者：qqqq
    原文地址: https://segmentfault.com/a/1190000014342422
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞