this 指针

2021-04-07  本文已影响0人  my木子

默认绑定

    var num = 1;
    function fun() {
      var num = 2;
      console.log(this.num);    // 1
    };
    fun();

隐式绑定

    var a = 1;
    var obj1 = {
      a: 2,
      fun: function () {
        console.log(this.a);    // 2
      }
    }
    obj1.fun();    // obj

    // -----------------------------
    var b = 1;
    var obj2 = {
      b: 2,
      fun: function () {
        console.log(this.b);    // 1
      }
    }
    var f = obj2.fun;
    f();    // window

硬绑定 call、apply、bind

    var obj = {
      num: 1,
      fun: function () {
        console.log(this.num);
      }
    }
    var obj1 = {
      num: 2
    }
    var obj2 = {
      num: 3
    }
    var obj3 = {
      num: 4
    }
    obj.fun();            // 1
    obj.fun.call(obj1);   // 2
    obj.fun.apply(obj2);  // 3
    obj.fun.bind(obj3)(); // 4

构造函数绑定

    function Fun(val) {
      this.num = val;
      this.getNumber = function () {
        console.log(this.num);    //  1
      };
    };

    var f = new Fun(1);
    f.getNumber();

箭头函数

var a = 0;
var obj1 = {
    a: 1,
    getNumber: function () {
        var fn = function () {
           console.log(this.a);  // 0
        };
        return fn();
    }
};

var obj2 = {
    a: 2,
    getNumber: function () {
        var fn = () => {
            console.log(this.a); // 2
        }
        return fn();
    }
};
obj1.getNumber(); // window
obj2.getNumber();

知识点补充

    function Fun1() {
      this.num = 1;
      return 2
    }
    var f1 = new Fun1();
    console.log(f1.num); // 1

    // ---------------------------------
    function Fun2() {
      this.num = 1;
      return {
        num: 2
      };
    }
    var f2 = new Fun2();
    console.log(f2.num); // 2

    // ---------------------------------
    function Fun() {
      this.num = 1;
      return null;
    }
    var f = new Fun();
    console.log(f.num); // 1
上一篇下一篇

猜你喜欢

热点阅读