JS：this关键字1

this 代表了当前的对象，哪个对象调用了this所在的函数，this就代表了哪个对象；

例1：

        function fn(){
            var a = 1;
            console.log(this)
        }
        fn()

 

控制台打印结果： Window {window: Window, self: Window, document: document, name: '', location: Location, …}

此时，是Window对象调用了fn这个函数，所以this指向了Window。

例2：

var obj = { 
    b : 2, 
    name : "lili", 
    fn:function(){ var a = 3; console.log(this); } } 
obj.fn()

 

控制台打印结果： {b: 2, name: 'lili', fn: ƒ}

此时是obj对象调用了函数fn，因此this指向了obj，控制台返回的是obj整个对象。

 

例3：

        var obj2={fn:function(){console.log(this,1111)}}
        var arr=[]
        arr[0]=100
        arr[1]=obj2.fn

        console.log(arr[1])//window obj2
        arr[1]()
        obj2["fn"]()

打印结果：

 

 调用者是arr时，this就指向了arr；

 调用者是obj2时，this就指向了obj2。

 

例4：

        var obj = {
            name: "father",
            son: {
                name: "son",
                say: function () {
                    console.log(this)
                }
            }
        }
        obj.son.say()    //调用者时obj.son

        var a = obj.son.say
        a();    //调用者是window
        var arr = [a]
        arr[0]();    //调用者是arr

结果：

 

 

例5：

找到函数的真正调用者

        var obj = {
            name: "karen",
            say: function () {
                console.log(this) //obj
                function fn(a) {
                    console.log(a, this) //obj winodw
                }
                fn(this) //fn(obj)
            }
        }
        obj.say() //obj

        fn() // window
        obj.fn() //obj
        obj.xx.xx2() //obj.xx 
        (function () {})() //window
        fn()() //window
        fn()[1]() // fn()返回的数组    

this只需要看离最近(嵌套)的function的这个单词的调用者。

 

        var name = 'lili';
        var obj = {
            name: 'fa',
            prop: {
                name: 'sn',
                getname: function () {
                    return this.name;
                }
            }
        };
        console.log(obj.prop.getname());    //调用者是obj.prop;   sn
        var test = obj.prop.getname;    //在window环境下定义的test;
        console.log(test());    //调用者是window;    lili;

 

 

        var name = "lili";
        var obj = {
            name: "karen",
            fn: function () {
                console.log(this.name)
            }
        }
        var a = obj.fn
        a()    //window;   lili