背景：今天群裡有 妹子(我就不指名道姓嘍)說：百度了一圈calll()函式和apply()函式，感覺還是糊里糊塗

然後群裡熱鬧了，各種表情包，各種殷勤，你懂的！正好我前幾天剛又重新翻了一遍 那本 600多頁 的聖經書，我習慣時不時的去打下基礎，只是為了用來裝逼，給人講解。。。。（我是有多蛋疼）！

好了下面針對這個問題，我看好多小朋友 都不理解或者很迷惑，確實容易繞暈，畢竟是js獨有的面向物件

嘛，你要一下理解了 才是不正常。開始： 先說call 這個東西

NO 1：我們先看一個簡單的例子 1+1 = 2 你應該會吧

function add(a,b)  
{  
    alert(a+b);  
}  
function sub
 
(a,b)  
{  
    alert(a-b);  
}  

add.call(sub,1,1);  //  結果是？  ‘2’  還是   ‘0’  呢

• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8
• 9
• 10
• 11

• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8
• 9
• 10
• 11

這裡寫程式碼片有人說是 1+1 =2； 有人說明顯變成 1-1 = 0 了嘛! 
其實 add.call(sub,1,1)； 等價於add(1,1) = 2 。。。。。

那你這不是腦殘嗎？非要多此一舉 弄個該死的call ，搞毛？ 直接 add(1,1) 不行了嗎？

我不太懂了，add.call（sub）了，肯定是add直接sub裡面的減法了呀，不然弄個call幹嘛呀？

什麼場景下會用到call， apply 這種裝逼的寫法呢；

好了，下面我們針對，群裡的小夥伴提出的疑問一一解答：

1. 那你這不是腦殘嗎？非要多此一舉 弄個該死的call ，搞毛？ 直接 add(1,1)

   答：其實 這個寫法就是再舉個例子 ，大家不要被迷惑 
   
       正常寫這種加減法功能 誰會腦殘這樣多此一舉？ 嘿嘿 我偷笑！
   

2. 我不太懂了，add.call（sub）了，肯定是add直接sub裡面的減法了呀，不然弄個call幹嘛呀？

   答：call的用法和意義：
   
   官方解釋：
   

   call和apply可以用來重新定義函式的執行環境，也就是this的指向； call 和 apply 都是為了改變某個函式執行時的 
   context 即上下文而存在的 換句話說，就是為了改變函式體內部 this 的指向。因為 

   JavaScript 
   的函式存在「定義時上下文」和「執行時上下文」以及「上下文是可以改變的」這樣的概念。

   call():

   • 語法：call(Obj,[arg1][arg1])

我的白話文：

call 就是中間牽線的，sub說 我需要 add 你的方法 和技能，

比如：add會飛天 ，但sub 不會飛，現在sub想飛，但add不讓它飛，所以sub就叫來了 call 這個東西， call直接把add爆菊 

加上一個 點 然後把sub抱到括號裡，然後 sub 就直接把add 的“飛天”技能學會了，回到函式

----------


function add(a,b)  
{  
    alert(a+b);  
}  
function sub(a,b)  
{  
    alert(a-b);  
}  

add.call(sub,1,1); 
 //  結果是 sub直接集成了 add 的“飛天”技能  sub alert裡面 直接變成了 “a+b”！主角還是sub，並不是add ，你要搞清楚！

• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8
• 9
• 10
• 11
• 12
• 13
• 14
• 15
• 16

• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8
• 9
• 10
• 11
• 12
• 13
• 14
• 15
• 16

 3. 什麼場景下會用到call， apply 這種裝逼的寫法呢；

    答：看例子 

        function changeStyle(attr, value)
        {     
            this.style[attr] = value; 
         }  
        var box = document.getElementById('box');  
        window.changeStyle.call(box, "height", "200px");

• 1
• 2
• 3
• 4
• 5
• 6

• 1
• 2
• 3
• 4
• 5
• 6

在這裡，changeStyle函式將被box物件呼叫，this指向了box物件，如果不用call的話，程式報錯，因為

window物件中沒有style屬性。apply的用法:

window.changeStyle.apply(box, [‘height’, ‘200px’]);

現在 window物件 “box” 這個div 的高 直接變成200px了，

window.changeStyle.call(box, “height”, “200px”)

等價於 box.style.height=”200px”；

看到這裡應該明白了吧 沒如果還沒明白

apply() 這個用法

window.changeStyle.apply(box, [‘height’, ‘200px’]);

看了這個寫法 你應該明白了把， 啊哈其實 就是寫法 和形式不同而已，本質是一樣的，apply(),是推進到

數組裡而已，也是為了改變this、

這個，也是為了偷 add 的飛天技能哈！

總結一句話：call（） 就是用來讓括號裡的物件 來整合括號外的函式的屬性！可以稱之為繼承！

歡迎觀看，純屬原創， 碼字不容易，如需轉載，請註明網址出處 謝謝！

入坑方式：   歡迎加入~！氣氛熱情，歡樂多，妹子多！

web前端 聚集地，匯聚了全國頂尖的web前端熱愛者，最新技術，最炫潮流，最靠譜的話題：
  做好現在！技術只是為了改變生活！JS前端實用開發QQ群 ：147250970

 掃描螢幕下方的二維碼，可以關注 我的前端公眾號 。聽說妹子挺多的，及時更新一些前端解惑和段子