this

2017-06-30  本文已影响0人  chengfengwang

this是什么?

var person = {
  name: '张三',
  describe: function () {
    return '姓名:'+ this.name;
  }
};

person.describe()

this总是返回一个对象,简单说,就是返回属性或方法“当前”所在的对象。
(在控制台打个this试试)

上面代码中,this.name表示describe方法所在的当前对象的name属性。调用person.describe方法时,describe方法所在的当前对象是person,所以就是调用person.name

以下代码输出什么?

var A = {
  name: '张三',
  describe: function () {
    return '姓名:'+ this.name;
  }
};

var name = '李四';
var f = A.describe;
f() 

答案:"姓名:李四"
var f = A.describe; //用变量赋值的方法声明了一个函数f
f() //f函数里面有this,执行f函数时,f所在的对象是window
所以this.name,指的是window.name
document.addEventListener('click', function(e){
    console.log(this);      //绑定事件的元素
    setTimeout(function(){
        console.log(this);   //window
    }, 200);
}, false);
var o = {
  f1: function () {
    console.log(this);
    var f2 = function () {
      console.log(this);
    }();
  }
}

o.f1()  //object  window
相当于执行  ////////
var o = {
    f1: function () {
        console.log(this);
        var f2 = tem();
        function tem(){console.log(this);}
    }
}

o.f1()

以下代码有什么问题?怎么修改?

var module= {
  bind: function(){
    $btn.on('click', function(){
      console.log(this) // this指什么 $btn
      this.showMsg(); // 报错
    })
  },

  showMsg: function(){
    console.log('饥人谷');
  }
}
//答案
var $btn = $('#btn');
var module= {
  bind: function(){
      var _this = this;
    $btn.on('click', function(){
      console.log(_this) // this指什么 module对象
      _this.showMsg(); // 饥人谷
    })
  },

  showMsg: function(){
    console.log('饥人谷');
  }
}
module.bind();
上一篇下一篇

猜你喜欢

热点阅读