js中改变this指向的几个方法

1、call函数

call函数可以改变具体如下

定义一个对象：

var a={
    name:'我是你爸爸'
}

定义一个普通方法

function b(){
            // alert(this)
            console.log(this)//普通函数中的this指向的是windown
    }

调用b函数，查看控制台打印,指向的是windown对象

b();

改变this的指向：

    b.call(a);

可以看到this的指向发生了改变

2、apply()函数

该函数跟call函数差不多，只不过可以传递第二个参数进去，第二个参数必须是一个数组

var arr=[1,2,3,55,30];
let result=Math.max.apply(Math,arr);
console.log(result)

2、bind()函数

bind()方法不会调用自身函数，但是自身拷贝了一份，可以用var接收，也可以改变this指向

var a={
    name:'我是你爸爸'
}
    function b(){
            // alert(this)
            console.log(this)
    } 
    var result=b.bind(a);//返回一个拷贝后的函数，这里不会自动打印，apply(),call()会自动打印。
result();//调用result函数（拷贝的，已经通过bind将windown（普通方法this默认指向windown）指向了a对象）

使用一个小案列理解this的指向：
点击按钮是按钮禁用，定义定时器，使按钮三秒钟后取消禁用，恢复可以点击

<button>点击</button>//定义按钮
<script>
    var btn=document.querySelector("button");//获取到按钮
    btn.onclick=function(){//绑定点击事件
        this.disabled=true;//此时的this指向调用者的本身，也就是btn，    this.disabled=true;表示这个按钮被禁用，也就被灰色不可以点击
        setTimeout(function(){//定义一个定时器
            this.disabled=false;//此时的this指向的定时器自身，所以这样写是不会使btn在三秒钟后恢复
        }.bind(this),3000)//重点：定时器的花括号外使用 .bind(this)就可以使this指向会btn，三秒钟后即可恢复按钮
    }
    </script>