前两篇文章“执行环境和作用域”和“js中的闭包”，我对谈了执行环境、作用域、作用域链和闭包的理解。但当牵涉到对象中的方法时，前面谈的东西就不那么适用了。先来看一个例子：
var name = 'a';
function getName(){
console.log(name);
}
var o1 ={
name: 'a1',
getName: getName
}
var o2 ={
name: 'a2',
getName: getName
}
o1.getName() // 'a'
o2.getName() // 'a'
上面的代码中，o1.getName()和o2.getName()都输出‘a’，根据"作用域的规则"很好解释。但问题是：我们既然使用了这种方式调用函数，肯定更希望gentName方法访问的是对象内部的‘name’属性。这时，就需要修改外部定义的getName方法了。前面谈过在函数执行时，会动态的创建一个活动对象，这个活动对象，被作为变量对象，推进执行环境栈中。同时，还会创建“arguments”对象和绑定this对象，arguments对象最为变量对象的第一个属性，保存着传入函数中的参数；this对象根据函数的执行环境动态地绑定。有句很经典的判断this指向的话：谁调用了函数，this就指向谁。
这样，只要把getName函数修改成下面的代码，就可以实现访问对象中name属性的效果：
function getName(){
console.log(this.name)
}
依靠上面经典的话，可以在很多情况下判断this的指向，但还有一些情况不使用。下面就分类来说下this。
1、纯粹的函数调用
这是函数最通常的用法。这时，不论函数是在全局作用域下执行，还是在函数中执行，this都是指向全局对象，也就是window对象。例如：
var person = 'xiaoming'
function f1(){
var person = 'xiaohong'
function f2(){
console.log(this.person)
}
f2()
}
f1(); // 'xiaoming'
2、作为对对象的方法调用
在函数作为对象的方法调用时，上面的那句经典的话，就很适用了。这里来看一个很典型的例子：
var age = 18;
var obj = {
age : 21,
fn: functoin(){
console.log(this.age)
}
}
(false || obj.fn)() // 18
在上面的代码中，在对象中的fn方法执行之前，会先执行‘||’运算，相当于：
(false || function(){
console.log(this.age)
})()
实际上，也就是fn方法在全局作用域中执行。所以，结果是18。
3、构造函数
构造函数中的this，指向对象的实例。例如：
function People(name){
this.name = name
}
People.prototyope.sayName() = function(){
console.log(this.name)
}
var p = new People('张三');
p.name //‘张三’l
p.sayName //'张三'
4、call、apply和bind
call、apply和bind方法都是函数对象中的方法，用来动态地改变函数中this的指向，只是用法不同。call和apply被调用时，不仅改变函数中this指向，而且执行该函数，但bind仅仅是改变函数中this的指向，并不执行。如下：
var x = 2;
var y = 3;
function getY(){
console.log(this.y)
}
var o = {
x: 1,
y: 4,
getX: function(){
console.log(this.x)
}
}
o.getX.call() //2
getY.bind(o)() // 4
call、apply和bind方法在未传入指定对象时，默认传入window 对象，因此，o.getX.call() 输出结果是2。使用bind方法时，仅仅改变函数中this指针的指向，而要执行需要在后面添加'()'。call 和 apply方法在使用时，除了第一个指定this对象的参数外，后面还可以添加原油函数的其他参数，call方法接受单个参数的罗列，而apply方法接受数组格式的参数(arguments对象也可以)。如下：
fn.call(o, param1,param2)
fn.call(o,[param1,param2])
注意点
- this的指向是不确定的，不要在函数中包含多层的this。在必要时，可以将this赋值给其他的变量，再使用。例如：self，that等。例如：
var o = {
f1: function() {
console.log(this);
var that = this;
var f2 = function() {
console.log(that);
}();
}
}
o.f1()
// Object
// Object
- 避免回调函数中的this：回调函数中的this往往会改变指向，最好避免使用。例如：
var o = new Object();
o.f = function () {
console.log(this === o);
}
o.f() // true
上面的代码是没什么问题的，但当把 o.f 作为事件处理的回调函数就不一样了。例如：
$('#button').on('click', o.f);
写在结尾：
如果觉得我写的文章对你有帮助，欢迎扫码关注我的公众号：海痕笔记
微信号：haihenbiji
