this指向

2021/12/10，星期五，晴，回想上一次更博客就像是在十天前一样。

今天来看看this指向的一个知识点，毕竟用到的地方也不少。

		// 谁调的函数，this指向谁（上一级）
        var name = 'aaa'
        function one() {
            var name = 'bbb'
            console.log(this.name);
        }
        one() // "aaa" 指向window

        var obj1 = {
            name: 'ccc',
            two: function () {
                console.log(this.name);
            }
        }
        obj1.two(); // "ccc" 指向obj1
        window.obj1.two(); // 还是"ccc"

        var obj2 = {
            name: 'ddd',
            obj3: {
                name: 'eee',
                fn2: function () {
                    console.log(this.name);
                }
            }
        }
        obj2.obj3.fn2();  // "eee" 函数被上一级对象调用或是对外层对象调用，this指向依然是他的上级 

        var obj3 = {
            name: 'ddd',
            obj4: {
                fn2: function () {
                    console.log(this.name);
                }
            }
        }
        obj3.obj4.fn2(); // "undefined" 函数上级没有name

        var obj4 = {
            name: 'ddd',
            obj5: {
                name: 'eee',
                fn2: function () {
                    console.log(this); // "window"
                    console.log(this.name); // "aaa"  之前15行声明的
                }
            }
        }
        var fn = obj4.obj5.fn2;
        fn(); // 真正调用的是window里的fn，之前只是obj5所引用



        //如果返回值是一个对象，那么this指向的就是那个返回的对象，如果返回值不是一个对象那么this还是指向函数的实例。
        function Three() {
            this.name = 'fff'
            return {}
        }
        var threeF = new Three()
        console.log(threeF.name); // undefined

		function Three2() {
            this.name = 'fff'
            return { name: 'ggg' }
        }
        var threeF2 = new Three2()
        console.log(threeF2.name); // ggg

        function Four() {
            this.name1 = 'fff';
            return function () { };
        }
        var fourF = new Four();
        console.log(fourF.name1); // undefined

        function Five() {
            this.name1 = 'fff';
            return 1;
        }
        var fiveF = new Five();
        console.log(fiveF.name1); // "fff"



        // null也是对象，但是在这里this还是指向那个函数的实例，因为null比较特殊.
        function Six() {
            this.name1 = 'fff';
            return null;
        }
        var sixF = new Six();
        console.log(sixF.name1); // "fff"



        // new关键字改变this指向，将this指向对象Seven，因为new关键字会创建对象实例
        function Seven() {
            this.name = "ddd"
        }
        var sevenF = new Seven()
        console.log(sevenF.name); // "ddd" 指向sevenF

总而言之，正常情况下，先去找调用this的那个函数的父级，构造函数new改变指向return对象指向那个return的对象（null例外），不是对象或者没有return则指向函数的实例（null是对象但是指向函数实例）。

搞定收工！