改变JavaScript中函数的内部this指向！

改变JavaScript中函数的内部this指向！

第一种方法 call

call 可以 调用函数 + 改变函数内的this指向！

  var obj = {
           name: 'lvhang'
       }
       function fun(a, b) {
           console.log(this);
           console.log(a + b)
       }
    // 需求， 让fun函数中的this指向obj对象！还可以进行参数传递!
    fun(obj, 4, 6);
 

call 主要作用可以实现继承！

  // call 主要作用可以实现继承！
    function Father(uname, age, gender) {
        this.uname = uname;
        this.age = age;
        this.gender = gender;
    }
    function Son(uname, age, gender) {
        Father.call(this, uname, age, gender);
    }
    var son = new Son('name', 'age', 'gender');
    console.log(son)

第二种方法 apply 方法

1 apply 调用函数 + 改变函数内的this指向！

2 第二个参数是一个数组！伪数组！你必须以一个数组的形式传过去才可以!

3 apply 的主要应用比如说我们可以利用apply 借助于数学内置对象求最大值和最小值！

   // apply 方法！应用 运用的意思!
        // 第一个参数还是this的指向！

        var obj2 = {
            name: 'lvchengxin'
        }

        function fun2(arr) {
            console.log(this);
            console.log(arr);
        }
        fun2.apply(obj2, ['lvhang'])
        // 1 apply 调用函数 + 改变函数内的this指向！
        // 2 第二个参数是一个数组！伪数组！你必须以一个数组的形式传过去才可以!
        // 3 apply 的主要应用比如说我们可以利用apply 借助于数学内置对象求最大值和最小值！

        // Math.MAX();
        var arr = [12,44,6,565,334];
        // var res = Math.max.apply(null, arr)
        // 但是this指向为空是不太合适的！应该是谁调用他就指向谁！Math
        var res = Math.max.apply(Math, arr);
        var res2 = Math.min.apply(Math, arr);
        console.log(res, res2);

他和call 的不同之处就在于 他接受的参数必须是一个数组!

第三种方法 bind 方法

不会调用函数， 但是能够改变函数内部的this指向！

参数是和call一样的！

返回值是指定的this初始值和初始化参数改造的原函数拷贝!也就是返回的是原函数改变this之后产生的新函数！

  // bind 方法
        
        var obj3 = {
            name: 'lvchengxin'
        }

        function fun3(a, b) {
            console.log(this);
            console.log(a + b);
        }
        var f = fun3.bind(obj3, 3, 4)
        f();
        // 不会调用函数， 但是能够改变函数内部的this指向！
        // 参数是和call一样的！
        // 返回值是指定的this初始值和初始化参数改造的原函数拷贝!也就是返回的是原函数改变this之后产生的新函数！
        // 但是bind 和apply 和 call 不同的是 他不会调用函数！

但是bind 和apply 和 call 不同的是 他不会调用函数！

call apply bind总结

相同点:
都可以改变函数内部的this指向.
区别点:

1. call 和apply会调用函数,并且改变函数内部this指向.
2. call 和apply传递的参数不一样call传递参数aru1, aru2.形式apply必须数组形式[arg]
3. bind 不会调用函数,可以改变函数内部this指向.
   主要应用场景:
4. call 经常做继承
5. apply 经常跟数组有关系比如借助于数学对象实现数组最大值最小值
6. bind 不调用函数,但是还想改变this指向.比如改变定时器内部的this指向.

apply使用频率是最高的！

  <button>bind方法是最常用的！</button>
   <script>
    // 我们有一个按钮，当我们点击了之后，就禁用这个按钮, 3秒钟之后开启这个按钮
    var btn = document.querySelector('button');
    // btn.addEventListener('click', function() {
    //     this.disabled = true;
    //     // 原始做法
    //     var that = this;
    //     setTimeout(function() {
    //         that.disabled = false;
    //     }, 3000)
    // })
    // btn.addEventListener('click', function() {
    //     this.disabled = true;
    //     // 原始做法
    //     var that = this;
    //     setTimeout(function() {
    //         that.disabled = false;
    //     }, 3000)
    // })
    // btn.addEventListener('click', function() {
    //     this.disabled = true;
    //     // 给函数绑定bind方法！
    //     setTimeout(function() {
    //         this.disabled = false;
    //     }.bind(btn), 3000)
    // })
      btn.addEventListener('click', function() {
        this.disabled = true;
        // 给函数绑定bind方法！
        setTimeout(function() {
            this.disabled = false;
        }.bind(this), 3000)
    })