javascript 中的this

javascript 中的this

javascript中的this 经常让人迷迷糊糊，让人难以理解，时常困惑this 到底指向谁呢？

首先在window 下面，全局变量直接输出this ，这个是不需要疑问的,this指向window

console.log(this);//window

那么接下来看看function里面的this的指向

规则1

    //在这里 this 都是指向window
    function x(){
        console.log(this);
        var xx=function(){
            console.log(this);
        }

        xx();
    }
    x();//window window 

    new x()//x  window
    /**这里使用了new 关键字,当一个函数被使用new 关键字执行的时候,那这个函数就是成了一个 类 ,new 出来的就是对象了,所以this 指向当前对象,但是第二个this 还是指向Windows,这个说明了什么 ,this 和prototype 是不同的,原型是会一层一层的往上找,一直找到对应的原型或者找到object 为止 (object是一切对象的父类)*/ 

总结出就是this 在函数里面只会指向当前对象或者是Window对象, 指向当前对象的条件是,function是一个
以new 声明的对象.,这个描述其实是不够准确的.

规则2

var  A = {
        xx:function(){
            console.log(this);//第一层级
            var x =function(){
                console.log(this);//第二层级
            }
            x();
        }
    }
    A.xx();//this指向A

在一个对象里面的所有第一层级调用this 都是指向当前对象,第二层级及以上都是指向Window对象.自然如果它是以new 的方式声明的,那么就是当前函数名的对象, 它下面的再嵌套也就以上一层级为准.

规则3

call apply 都可以改变当前this 的指向. 还有es6 的箭头函数,效果等同于bind
而call apply 效果是一模一样的,唯一的不同就是参数,一个是列出所有参数,一个是把所有参数放到一个数组里面传入.

var  A = {
        arr :[],
        push:function(){
            this.arr.push(1);
        }
    };
var B = {
        arr:[],
    }
    A.push.call(B);/*把B传入,执行A的push方法, push 方法里面的this 已经被改变 -->B 相当于B.arr.push(1);*/
    console.log(A.arr); //[]
    console.log(B.arr);//[1]
    B.push();//报错,没有 B.push is not a Function 
    //apply就不再举例说明了

如有疑问或错误,欢迎大家指正,