this指向

 // 1. call() 
        var o = {
            uname:'andy'
        }
        function fn(a,b) {
            console.log(this);
            console.log(a + b);
        }
        fn.call(o,1,2);
        // call第一个可以调用函数第二个可以改变函数内的this 指向
        // call的主要作用可以实现继承
        function Father(uname,age,sex) {
            this.uname = uname;
            this.age = age;
            this.sex = sex;
        }
        function Son(uname,age,sex) {
            Father.call(this,uname,age,sex);
        }
        var ldh = new Son('刘德华',18,'男');
        console.log(ldh);

  <script>
        // JavaScript 为我们专门提供了一些函数方法来帮我们更优雅的处理函数内部 this 的指向问题，常用的有 bind()、 call()、apply() 三种方法。
        // 1. apply()  应用 运用的意思
        var o = {
            uname:'andy'
        }
        function fn(arr) {
            console.log(this);
            console.log(arr);
        }
        fn.apply(o,['red']);
        // 1．也是调用函数第二个可以改变函数内部的this指向
        // 2．但是他的参数必须是数组(伪数组)
        // 3. apply的主要应用比如说我们可以利用apply 借助于数学内置对象求最大值
        // Math.max();
        var arr = [1,33,22,54,78];
       var max = Math.max.apply(Math,arr);
       var min = Math.min.apply(Math,arr);
       console.log(max,min);
​
​
    </script>

 <button>按钮</button>
    <script>
        // bind() 绑定 捆绑的意思
        var o = {
            uname:'andy'
        };
        function fn(a,b) {
            console.log(this);
            console.log(a + b);
        }
        var f = fn.bind(o,1,2);
        f();
         // console.log(arr);
        // 1．不会调用原来的函数可以改变原来函数内部的this 指向
        // 2．返回的是原函数改变this之后产生的新函数
        // 3．如果有的函数我们不需要立即调用，但是又想改变这个函数内部的this指向此时用bind
        //4．我们有一个按钮,当我们点击了之后,就禁用这个按钮,3秒钟之后开启这个按钮
        var btn = document.querySelector('button');
        btn.addEventListener('click',function() {
            this.disabled = true; //这个this指向的是 btn这个按钮
            setTimeout(function(){
                // that.disabled = false; //定时器函数里面的this指向的是window
                this.disabled = false;  //此时定时器函数里面的this指向的是btn
            }.bind(this),3000) //这个this指向的是btn这个对象
        }) 
    </script>