1. 程式人生 > >來談談call,apply,bind吧,再加上點this指向也不錯

來談談call,apply,bind吧,再加上點this指向也不錯

####首先呢,畢竟這個問題老生常談了,我寫的也不一定比別人寫的好,但是隻是自己的一些理解,會說的儘量通俗易懂一些。

來隨便談一談吧,這三個東西,面試十家公司,會有九家問,這個是什麼意思,幹什麼用的,有啥區別,別和他廢話,簡明扼要,全部用來改變this指向,區別在於bind不會執行,apply和call引數不同,僅此而已。那麼問題來了,為什麼要改變this指向呢,this指向個啥,嘿嘿嘿,那就再寫寫this吧 this呢 說白了就是找(qi)大(mo)佬(ji) 首先來說說 正常情況下 是全域性 瀏覽器下 是window 嚴格模式下就是undefined,來段程式碼吧

function consolethis() {
    console.log(this)
}
function consolestrictthis() {
    'use strict'
    console.log(this)
}
consolethis();//window
consolestrictthis();//undefined

再來談談呼叫 簡單的來說呢 誰呼叫,this就指向誰。這些呢是基本的this, 再者的話就是箭頭函式的this,這個貨終於老實了,它就是定義時所在的物件 建構函式的this,就指向它的例項物件,好 簡答瞭解下this即可。 在這裡插入圖片描述

function father(name,age) {
    this.name = name;
    this.age = age;
}
function person(name,age,sex) {
    father.apply(this,arguments)//father.call(this,name,age)或 father.bind(this)(name,age)
    this.sex = sex
}
var person = new person(1,2,3)
console.log(person)

一個簡單的小栗子,實現一個繼承,其實已經很明白了 call 和 apply 都是把father的函式體內部的this換成當前this,然後去執行走一圈,也就是相當於去執行一次函式。 然後bind的話其實是建立了一個新函式,如果不立即呼叫,那麼不生效,如果呼叫,後面傳參即可 再來看看妙用

記得有一道題是這樣的 偽陣列怎麼轉換成陣列,如果是你你會怎麼做呢,來直接看簡單的吧

Array.prototype.slice.call(arguments)

來解讀一下這段程式碼的意思 把arguments偽陣列呼叫Array。prototype.slice方法並改變this指向,然後把所有元素截出來,完成轉換偽陣列,也就相當於是偽陣列呼叫了陣列的擷取方法,並且截取了所有的元素,當然,這三個方法的用處絕對不止這些,也要適當的考慮用處,例如react元件中的方法使用bind供人呼叫,等等等,不一一舉例。