this的应用场景和固定

• this是函数执行时才会创建的一个内部对象，表示当前持有该函数的对象

四类场景

1. 对象内部的属性值为函数，使用对象访问属性并执行函数时。this代表当前对象

var person = {
            name:"tom",
            say:function(){
                console.log(this);
            }
        };
        person.say();
        person.eat = function(){
            console.log(this); 
        };
        person.eat();

• 为按钮添加点击事件

document.getElementsByTagName('input')[0].onclick = function(){
            console.log(this); //表示input对象
        };

2. 构造函数中的this,函数执行时this表示新对象

function Person(name,age){
            this.name = name;
            this.age = age;
            console.log(this);
        }
        var p = new Person("tom",28);

3. 使用call或apply主动修改函数时，this的指向，让其等于call或apply的第一个实参

function getpro(proName){
            return this[proName];
        }
        console.log(getpro("p"));
        console.log(getpro.call(person,"name"));

• 所有的全局变量都是window的私有属性

4. 除以上三种场景外，this代表的是window

function fn(){
            console.log(this);
        }
        fn();

• 函数嵌套函数,无论函数嵌套多少层，都表示window

function fun(){
            console.log(this);
            function fun(){
                console.log(this);
                function fun(){
                    console.log(this);
                }
            }   fun();
            fun();
        }
        fun();

this的固定

document.getElementsByTagName('input')[0].onclick = function(){
            var _t =this;//var _this = this; 这叫this的固定
            colorful();
                function colorful(){

                // document.getElementsByTagName('input')[0].className = "colorful";
                _t.className = "colorful";
            }
        };

            function colorful(-t){
                // document.getElementsByTagName('input')[0].className = "colorful";
                _t.className = "colorful";
            }