this的指向问题

2021-03-26  本文已影响0人  小小鱼yyds
this一般有4种指向:

举例:

    var name = 'tanaka'
    var age = 22
    var obj = {
      name: 'yoxida',
      objAge: this.age,
      myFuc: function( ) {
        console.log(this.name + '的年龄是' + this.age)
      }
    }
    console.log('打印this指向----', obj.objAge)     // 22,指向windows
    obj.myFuc()      // yoxida的年龄是undifind ,

第一个this指向的是windows,第二个this指向构造函数创建出来的实例,没有取到全局声明的age。
但如果是全局声明的函数则指向window。

如何转移this的指向:
  var name = 'tanaka'
    var age = 22
    var obj = {
      name: 'yoxida',
      objAge: this.age,
      myFuc: function( ) {
        console.log(this.name + '的年龄是' + this.age + this.age)
      }
    }

    var db = {
      name: 'hayaxia',
      age: 33
    }

    // 转移this的指向
    obj.myFuc.call(db)   // hayaxia的年龄是33
    obj.myFuc.apply(db)  // hayaxia的年龄是33
    obj.myFuc.bind(db)()   // hayaxia的年龄是33,bind的返回的是新函数,必须调用才能执行

传参方式:

    var obj = {
      name: 'yoxida',
      objAge: this.age,
      myFuc: function(fm, tm) {
        console.log(this.name + '的年龄是' + this.age + '从' + fm + '去' + tm)
      }
    }
     var db = {
      name: 'hayaxi',
      age: 33
    }

    obj.myFuc.call(db, '上海', '天津')
    obj.myFuc.apply(db, ['上海', '天津'])
    obj.myFuc.bind(db, '上海', '天津')()

打印出来的都是“hayaxi的年龄是33 从上海去天津",但要注意apply的传参方式是把参数放进数组里

例子来源于:https://www.runoob.com/w3cnote/js-call-apply-bind.html

上一篇 下一篇

猜你喜欢

热点阅读