創新互聯www.cdcxhl.cn八線動態BGP香港云服務器提供商，新人活動買多久送多久，劃算不套路！

成都創新互聯專注于樺甸企業網站建設,響應式網站建設,電子商務商城網站建設。樺甸網站建設公司,為樺甸等地區提供建站服務。全流程定制網站開發，專業設計，全程項目跟蹤，成都創新互聯專業和態度為您提供的服務

本篇文章給大家分享的是有關在js中call、apply和bind之間有什么區別，小編覺得挺實用的，因此分享給大家學習，希望大家閱讀完這篇文章后可以有所收獲，話不多說，跟著小編一起來看看吧。

                                                           前言

在面試的過程中，會有許多新問題出現來讓你拓展新的知識，也會發現學習中忽略的點。

在前兩天的一次面試中，面試官就問了call、apply和bind的區別。事實上，我們也應該領悟得到面試官更想問到的東西是什么，也就是拓展出來的東西。

---

call

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

作用

1. 調用函數

2. 改變this，作為第一個參數

3. 傳遞參數，第二個參數之后的所有個數的參數

案例

function fn1(){
    console.log(1);
}
function fn2(){
    console.log(2);
}
fn1.call(fn2); //輸出 1
fn1.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里的方法

作用

1. 調用函數

2. 改變this

3. 傳遞參數，第二個參數之后的所有數組參數

與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里的方法

作用

1. 改變this

2. 傳遞參數，第二個參數之后的所有個數參數

3. 返回新函數

與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之間有什么區別，小編相信有部分知識點可能是我們日常工作會見到或用到的。希望你能通過這篇文章學到更多知識。更多詳情敬請關注創新互聯-成都網站建設公司行業資訊頻道。

分享標題：在js中call、apply和bind之間有什么區別-創新互聯
標題路徑：http://vcdvsql.cn/article12/jiogc.html

成都網站建設公司_創新互聯，為您提供面包屑導航、小程序開發、用戶體驗、品牌網站建設、網站建設、微信小程序

廣告

聲明：本網站發布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源： 創新互聯