javascript中this的用法----个人见解

浏览数：17 / 时间：2015年06月08日

this在javascript里面一直是让人比较纠结的一块，特别是混在在复杂对象、继承、函数里面，还有一些call、apply这些变态的函数，更是让人头疼不已。

本文只是我个人对this的一些总结，分享给大家，只求你一看能有收获。具体内容可能有偏差，也可能比较肤浅，敬请大家留言交流指正。

首先，我认为，理解js里面的this，首先是理解this这个东西。相信很很多人和我一样，只知道this这样用，那样用，却忽略了一个最基本的事实：this其实指的就是一个对象。一个对象的代名词，不是指一个字符串，也不是一个函数等等。仅仅是一个对象。

基本含义：this 对象返回“当前”对象。在不同的地方，this 代表不同的对象。也就是所谓的this所代表的对象要看实际运行时候的上下文环境。

我今天也正好就单单从“this只是指向对象”这个思路来展开，下面通过几个简单例子来看一下几种情况，然后进行简单的分析：

e.g.1

比如：var a=function(){
return this;
}
console.log(a()==window) //true

此时，a是一个全局的函数表达式，外面没有对象，所以其值默认就是最外面的window对象。页面里面所有的对象和内容都是window对象的子孙，所以上面的this指向值其实是window。

从这个，可以总结：

如果外部没有对象定义，this指向默认的window对象。

e.g.2

再比如，var person={

name:"张三",

sayThis:function(){

return this;

}

console.log(person.sayThis()==window) //false

console.log(person.sayThis()==person) //true

这次把相同的函数声明，放到一个对象里面，从测试结果可以看出，this此时已经不指向外侧的window了，已经指向定义其的外部对象了。这里就是person

从这个，可以总结：

如果外部有对象定义，this指向其外部的对象。

e.g.3

如果将此对象的内部方法赋予外部的其他对象呢，这样，this值指向什么呢

var 
person={
                   name:"123",
                 returnThis:function(){
                     return 
this;
                 }
             }
            var 
man={
                name:"456",
                getNowThis:this,
                sayThis1:person.returnThis(),
                sayThis2:person.returnThis
            }
  
           console.log(man.sayThis1);                        //person   这里在赋予sayThis1的值时候，returnThis方法已经运行，
                                                             //         this值已经确定, 指向returnThis所在的环境里面的this
          console.log(man.sayThis2());             
                                                             //man      这里在赋予sayThis2的值时候 ，只是把returnThis所代表的
                                                              //         函数赋予给sayThis2，所以最后在运行man.sayThis2()函数的时候，
                                                             //        实际上运行的是return this,故this指向man
 
 //这里,主要把person对象returnThish和returnThish()分别赋予给man对象 

从这个，可以总结：

this值指向的对象确实如大家所说，看实际运行时候的环境变量。this值相应的也会有所改变。（这恐怕是js里面最让人费解又非常强大的功能之一了吧）

e.g.4

数组里面有没有this指向呢？

var 
arr=[
                
           function(){     return 
this;     } ,
            2,
            3,
            4           
      ]
    console.log(arr[1])              //2
    console.log(arr[0]())           // arr       得到的是这个数组，说明this指向的是这个数组本事
    arr[0]()==arr                   // true       证实了this等于这个数组
    arr[0]()[1]                      //2            this可以正常当做数组也使用

由上面的例子可以看出，数组的this值也指向该this，我猜测了一下，得出下面的结论：

数组也有this，因为数组本来就是object对象的一种。遵从于this指向对象的结论。（此处我不禁想，字符串等也是一种隐式声明的对象，有this值么。感兴趣的可以测试一下）

e.g.5

在构造函数里面也会存在this

function 
Person(){
     this.age=25;
     this.title="title";
      this.sayThis=function(){
         return 
this;
     }
  }
 var 
person1=<span style="color: rgb(255, 0, 0);">new</span> Person();
 Person.age                      // undefined
 person1.age                     //  25
 person1.sayThis() .title        //  "title"
 person1.sayThis()==Person       // fasle
 person1.sayThis()==person1      // true