本篇文章给大家分享的是有关在js中call、apply和bind之间有什么区别，小编觉得挺实用的，因此分享给大家学习，希望大家阅读完这篇文章后可以有所收获，话不多说，跟着小编一起来看看吧。

前言

在面试的过程中，会有许多新问题出现来让你拓展新的知识，也会发现学习中忽略的点。

在前两天的一次面试中，面试官就问了call、apply和bind的区别。事实上，我们也应该领悟得到面试官更想问到的东西是什么，也就是拓展出来的东西。

call

call是所有函数都能调用的方法，是Function.prototype里的方法

作用

调用函数

改变this，作为第一个参数

传递参数，第二个参数之后的所有个数的参数

案例

function fn1(){ console.log(1);}function fn2(){ console.log(2);}fn1.call(fn2); //输出 1fn1.call.call(fn2); //输出 2

解析：
第一行输出，调用了fn1并将this指向fn2
第二行输出，事实上，执行的call()才是关键，这里就涉及了Function.prototype.call()的机制，它只是把.call()之前的代码段当作一个变量，将传递的代码段指向this，则fn1.call指向了fn2，于是就相对于fn2.call()，只是这里传递的this为window

运用

继承的方法

function Father(uname,age){ this.uname= uname; this.age=age; } Father.prototype={ constructor:Father, sing:function(){ console.log("唱跳rap"); } } function Son(){ Father.call(this,uname,age) } Son.prototype=new Father();

apply

apply同样也是所有函数都能调用的方法，是Function.prototype里的方法

作用

调用函数

改变this

传递参数，第二个参数之后的所有数组参数

与call的区别

apply第二个参数是Array，而call是将参数以个数的形式传入

运用

运用Math函数获取最大值

let arr=Array.of(2,42,56,89,1,24,56,22) let max=Math.max.apply(Math,arr) console.log(max);

bind

bind同样也是所有函数都能调用的方法，是Function.prototype里的方法

作用

改变this

传递参数，第二个参数之后的所有个数参数

返回新函数

与call、apply的区别

与前两者的最大不同就是不会调用函数并且修改后返回新的函数

运用

let btns=document.querySelectorAll("button")for(let btn of btns){ btn.onclick=function(){ this.disabled=true; setTimeout(function(){ this.disabled=false; }.bind(this),2000); }}

上面的案例修改了定时器的this，同时不会调用函数。但事实上如果你用了箭头函数的写法，因箭头函数的this是关乎上下文的this，因此会简单许多，这个案例意在给我们理解bind的用法，那么在下面附上箭头函数的写法

let btns=document.querySelectorAll("button")for(let btn of btns){ btn.onclick=function(){ this.disabled=true; setTimeout(()=>{ this.disabled=false; },2000); }}

以上就是在js中call、apply和bind之间有什么区别，小编相信有部分知识点可能是我们日常工作会见到或用到的。希望你能通过这篇文章学到更多知识。更多详情敬请关注亿速云行业资讯频道。