js学习总结之this

this的指向经常把初学者绕晕，因此我花了时间仔细阅读书籍以及参考别人的博客

以下是我参考的博客链接
https://segmentfault.com/a/1190000002640298
http://www.cnblogs.com/sharpxiajun/p/4148932.html
http://web.jobbole.com/88264/
http://www.cnblogs.com/wangfupeng1988/p/3996037.html
将这些大牛与我自己的理解写一个总结

首先记住两句话，

1.如果在js语言中没有通过new(包括对象字面量定义)，call和apply改变函数的this指针，函数this指针都是指向window。

2.谁调用的函数，this就指向谁。

1.1 先阐述(没有通过new(包括对象字面量定义)，call和apply改变函数的this指针)函数this指针指向window或者说是全局变量

var a="yeman";
console.log(this.a);//yeman
console.log(window.a);//yeman

var a="yeman";
 function show1(){
    var a="xiee";
    var show2=function(){
            console.log(this.a)   //yeman
        }
        show2();
    }
show1();

var a="yeman";
function show1(){
    this.a="xiee";  
}
console.log(this.a);//yeman
show1();
console.log(this.a);//xiee,因为window.a 被改变为xiee

1.2 出现new(包括对象字面量定义)

《javascript高级编程》里对new操作符的解释：

　　new操作符会让构造函数产生如下变化：

　　1. 创建一个新对象；

　　2. 将构造函数的作用域赋给新对象（因此this就指向了这个新对象）；

　　3. 执行构造函数中的代码（为这个新对象添加属性）；

　　4. 返回新对象

var name="haha";
var a={
    name:"yeman",
    show:function(){
       console.log(this.name);  
    }
}
var b=new Object();
b.name="xiee",
b.show=function(){
    console.log(this.name);
}
a.show(); //yeman
b.show(); //xiee

1.3 call和apply对this的影响

var name="yeman";
function show(name){
    console.log(name);
    console.log(this);
    console.log(this.name);
}
show("xiee");
var obj={
    name:"haha"
};
show.call(obj,"haowan");

输出的结果依次是:
xiee
window
yeman
haowan
object{name="haha"}
haha

2.谁调用函数，this就指向谁

var name="xiee"     
var a={
    name:"yeman",
    show:function(){
       console.log(this.name);  
    }
 }
 a.show(); //yeman
如果fn函数不作为obj对象的属性来调用?
 var name="xiee"
var a={
    name:"yeman",
    show:function(){
       console.log(this);  //window
       console.log(this.name);   //xiee
    }
    };
 var b=a.show;
 b();

因为此时的函数不是作为对象的属性被赋值，而是作为一个普通方法被调用，因此this指向的是window

总结：这两条结合看。

补充当this碰到return
如果返回值是一个对象，那么this指向的就是那个返回的对象，如果返回值不是一个对象那么this还是指向函数的实例。还有一点就是虽然null也是对象，但是在这里this还是指向那个函数的实例，因为null比较特殊

function a(){
    this.id="yeman";      
}
var b= new a;
console.log(b.id); //yeman
---------------------------------------------------------

function a(){
    this.id="yeman";    
    return {};        
    //返回的对象，this指向返回的对象，该返回的对象为{}没有定义name，所以结果为undefined
}
var b= new a;
console.log(b.id);//undefined
-----------------------------------------------------------

function a(){
    this.id="yeman";    
    return function (){};        
    //返回的对象，this指向返回的对象，该返回的对象为function (){}没有定义name，所以结果为undefined
}
var b= new a;
console.log(b.id);//undefined
----------------------------------------------------------

function a(){
    this.id="yeman";    
    return 1;        
    //返回的不是对象，this指向函数的实例，所以结果为yeman
}
var b= new a;
console.log(b.id);//yeman   
-------------------------------------------------------------

function a(){
    this.id="yeman";    
    return undefined;        
    //返回的不是对象，this指向函数的实例，所以结果为yeman
}
var b= new a;
console.log(b.id);//yeman   
--------------------------------------------------------
function a(){
    this.id="yeman";    
    return null;        
    //null比较特别，本来null是对象，但他还是指向那个函数实例
}
var b= new a;
console.log(b.id);//yeman