js中的this详解

this是js中的一个关键字。

在了解this之前，先了解一下js中的执行环境。执行环境是js中最为重要的一个概念，js中的执行环境主要有两种：全局执行环境和函数执行环境。执行环境（Execution Context ）简称EC，可以将其看作一个对象，它由变量对象、this、作用域链组成。由此引出this。

在全局执行环境下，this指向window对象；在函数执行环境下，this指向调用该函数的对象。

全局执行环境：

在全局执行环境下，this等价于window。

    <script type="text/javascript">
        console.log(this);	//window
        console.log(this == window);	//true
    </script>

    <script type="text/javascript">
        function test(){
            var a = 1;
            console.log(this.a); //undefined    
            console.log(this);  //window
        }
        test();
    </script>

上图中，定义了一个test函数并调用它，test()等价于window.test()，即此时调用该函数的对象是window对象，故在执行函数的过程中，函数内部this指向window对象，由于window对象中并未定义变量a，故打印this.a结果为undefined。此时若将代码稍微改变一下，结果即如下图所示：

    <script type="text/javascript">
        var a = 1;
        function test(){
            var a = 1;
            console.log(this.a); //1 
            console.log(this);  //window
        }
        test();
    </script>

函数执行环境：

1.作为对象方法的调用

    <script type="text/javascript">
        var o = {
            user:"tom",
            fn:function(){
                console.log(this.user); //tom
            }
        }
        o.fn();
    </script>

上图中，由于调用fn函数的是o对象，故在执行函数的过程中this指向o对象。this的指向在函数创建的时候是无法确定的，在调用的时候才能确定，总是指向调用函数的那个对象。

2.作为构造函数调用

    <script type="text/javascript">
        function Fn(){
            this.user = "tom";
        }
        var a = new Fn();
        console.log(a.user); // tom
    </script>

上图中，创建了一个新对象，并将构造函数的作用域赋值给了新对象，因此this就指向这个新对象。

3.call and apply

call()和apply()是函数对象的方法，用于改变this的指向。

    <script type="text/javascript">
        function testFunc(val){
            this.a = val;
            this.b = 'bb';
        }

        function execFunc(){
            var a = 'exec aa';
            var b = 'exec bb';
            console.log(this.a, this.b);
        }

        var testInstance = new textFunc('aa');
        execFunc.call(testInstance);    //aa bb
        execFunc.apply(testInstance);   //aa bb
    </script>

call apply的第一个参数是func函数运行时的this值。上图中通过call apply函数将execFunc的this值指向testInstance对象。