this指向问题

this的指向在函数定义时是确定不了的，只有函数被执行时才能确定，this最终指向调用它的对象。

1.函数调用模式：

当一个函数并非一个对象的属性时，那么它就是被当做函数来调用。在这种模式下，this绑定为全局对象，在浏览器环境下就是window；

function a(){

var a = 'hello world';

console.log(this.hello); //undefined

console.log(this); //window

}

2.方法调用模式

当函数被保存为一个对象属性时，它就可以称为这个对象的方法。当一个函数被调用时，this被绑定到这个对象上。如果调用表达式包含一个提取属性的动作（.或[]），那么他就被称为方法调用

var o = {

name:'hello',

sayName:function(){

console.log(this.name);

}

}

o.name;

这里this的指向是o;因为调用sayName（）的是O；

var o = {

name:'hello',

b:{

fn：function(){

console.log

}

}

}

3.构造函数调用模式

如果在一个函数前面加上new关键字来调用，那么就会创建一个prototype成员的新对象，同时，this会被绑定到这个新对象上。这种情况下，这个函数就会成为这个函数的构造函数；

function Fn(){

console.log(this)

}

var a = new Fn();

在构造函，new出一个对象时，this指向这个构造函数，new关键字会改变this的指向；

function Fn(){

this.name = 'hello';

}

var f = new Fn();

console.log(f.name)

当new关键字，返回一个对象，this的指向就是那个对象；

如果返回的不是对象，this还是指向函数的实例，虽然null属于对象，但是返回null依然指向函数实例

function fn(){

this.name = 'hello';

return{};

}

var f = new fn();

console.log(f.name);

4.call和apply调用模式

JS中，函数也是对象，所有函数对象都有两个方法，call和apply，这两个方法可以让我们构建一个数组传递给函数，也允许我们改变this的指向

var name = 'window';

var o = {

name: 'obj'

};

function sayName(){

console.log(this.name);

}

sayName(); //window

sayName.call(o); //obj

sayName.apply(o); //obj

在全局范围内，this指向全局对象（浏览器下指向window对象）

对象函数调用时，this指向当前对象

全局函数调用时，应该是指向调用全局函数的对象。

使用new关键字实例化对象时，this指向新创建的对象。

当call和apply上下文调用时，指向传入的第一个参数。

转载于:https://my.oschina.net/u/4036426/blog/2992470