在js中,this总是指向一个对象,具体要看那个对象在运行时函数的执行环境(动态绑定
),即“函数在谁那被调用,this就指向谁”。
1、在对象的方法内调用——指向该对象
例如
var obj = { name: '小阔爱', getName: function () { console.log('this === obj?', this === obj); console.log('this.name=', this.name); }};obj.getName(); // '小阔爱'
2、在普通方法内调用——指向全局对象window
例如
window.name = '小阔爱';var getName = function () { return this.name;};console.log('getName=', getName()); // 小阔爱
或者
window.name = '小阔爱';var obj = { name: '宝批龙', getName: function () { return this.name; }};var getName = obj.getName;console.log('getName=', getName()); // 小阔爱
或者——当函数里面嵌套函数时,指向window
window.id = 'xiaokuoai';document.getElementById('baopilong').onclick = function () { console.log('this.id=', this.id); // 'baopilong' var newFun = function () { console.log('this.id=', this.id); // 'xiaokuoai' } newFun();};
注意:在ES5的strict模式下,普通函数内的this被规定为不会指向window,而是undefined
例如
function func () { 'user strict' console.log('this=', this); // undefined}func()
3、构造器调用(被new运算符调用)
当函数被new运算符调用时,该函数总会返回一个对象。
例如(一般情况)
var obj = function () { this.name = '小阔爱';};var newObj = new obj();console.log('newObj.name=', newObj.name); // '小阔爱'
特殊情况:(函数有返回值的情况)
如果返回值是一个对象,那么this指向的就是那个返回的对象,如果返回值不是一个对象那么this还是指向函数的实例。(区分构造器是否显式地返回一个object类型的对象)例如(不显式返回object对象)
var obj = function () { this.name = '小阔爱'; return '宝批龙';};var newObj = new obj();console.log('newObj.name=', newObj.name); // '小阔爱'
以及(显式返回object对象)
var obj = function () { this.name = '小阔爱'; return { name: '宝批龙' };};var newObj = new obj();console.log('newObj.name=', newObj.name); // '宝批龙'
4、call或apply调用
跟普通函数相比,这种方式可以动态改变传入函数的this
例如
var obj1 = { name: '小阔爱', getName: function () { return this.name; }};var obj2 = { name: '宝批龙'};console.log('obj1.getName=', obj1.getName()); // '小阔爱'console.log('obj1.getName.call(obj2)=', obj1.getName.call(obj2)); // '宝批龙'