javascript函數(shù)的call、apply和bind的原理及作用詳解
最早javascript實現(xiàn)繼承是通過 prototype 原型鏈,后來有了 class 類,可以像其他面向?qū)ο笳Z言一樣來實現(xiàn)類的繼承。
通俗點說就好像我們小時候,家里要將稻子加工成大米,但是家里又沒有打米機,那就只能背到村里別人開的打米房里,叫別人打開他的打米機,將我們的稻子喂進去,然后就能接出來大米了。
call
call 方法使用一個指定的 this 值和單獨給出的一個或多個參數(shù)來調(diào)用一個函數(shù):
function.call(thisArg, arg1, arg2, ...)
當?shù)谝粋€參數(shù)為 null 或 undefined 時,可以使用數(shù)組展開語法實現(xiàn)類似的結(jié)果。請注意,this 可能不是該方法看到的實際值:如果這個函數(shù)處于非嚴格模式下,則指定為 null 或 undefined 時會自動替換為指向全局對象,原始值會被包裝。
apply
apply 方法調(diào)用一個具有給定 this 值的函數(shù),以及以一個數(shù)組(或一個類數(shù)組對象)的形式提供的參數(shù):
function.apply(thisArg, [arg1, arg2])
call 和 apply 其實是同一個東西,區(qū)別只有參數(shù)不同,call 是 apply 的語法糖,call 方法接受的是一個參數(shù)列表,而 apply 方法接受的是一個包含多個參數(shù)的數(shù)組
bind
bind 方法創(chuàng)建一個新的函數(shù),在 bind 被調(diào)用時,這個新函數(shù)的 this 被指定為 bind 的第一個參數(shù),而其余參數(shù)將作為新函數(shù)的參數(shù),供調(diào)用時使用。
function.bind(thisArg[, arg1[, arg2[, ...]]])
三者第一個參數(shù)都是 this 要指向的對象,如果如果沒有這個參數(shù)或參數(shù)為 undefined 或 null,則默認指向全局 window。
實際應(yīng)用場景
應(yīng)用場景一:從數(shù)組中找出最大值、最小值
原生的 Math.max、Math.min 只能傳入用逗號分隔的參數(shù)列表,但實際業(yè)務(wù)中我們往往拿到的是數(shù)組,就可以用下面的方法來實現(xiàn)(也可以用擴展運算符 ... 實現(xiàn)):
let arr = [1, 2, 3] Math.min.apply(null, arr) // 這里第一個null表示不需要綁定this, 但是也不能省略,不能直接將arr給Math, 因為min必須接受兩個及以上參數(shù)
應(yīng)用場景二:偽數(shù)組轉(zhuǎn)化成真數(shù)組
一般用于dom節(jié)點列表、具有 length 和序號屬性的偽數(shù)組對象、函數(shù)參數(shù) arguments
Array.prototype.slice.apply(fakeArray) // slice 省略參數(shù)時就是截取出所有元素,此處相當于 Array.prototype.slice.apply(fakeArray, 0, fakeArray.length)
到此這篇關(guān)于javascript函數(shù)的call、apply和bind的原理及作用詳解的文章就介紹到這了,更多相關(guān)javascript函數(shù)的call、apply和bind內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
TypeScript創(chuàng)建一個簡單Web應(yīng)用
這篇文章主要為大家介紹了TypeScript創(chuàng)建一個簡單Web應(yīng)用,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪2022-05-05
詳解ES6 中的Object.assign()的用法實例代碼
這篇文章主要介紹了ES6 Object.assign()的用法及用途,本文給大家介紹的非常詳細,對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友可以參考下2021-01-01
詳解嵌套命名空間在TypeScript中如何應(yīng)用
命名空間是TypeScript中非常有用的概念,可以幫助我們組織和管理代碼,避免命名沖突,下面小編就來和大家聊聊嵌套命名空間在TypeScript中是如何應(yīng)用的吧2023-06-06
前端Base64格式文件上傳原理、實現(xiàn)與最佳實踐
Base64 上傳是前端處理文件時的一個經(jīng)典方案,尤其在接口只支持 JSON、需要同時傳文件+其他字段、或要做圖片預(yù)覽的場景中非常實用,因此本文將從原理到代碼,再到生產(chǎn)級最佳實踐,一次性講透,需要的朋友可以參考下2026-02-02
JavaScript 實現(xiàn)文件跳轉(zhuǎn)方法示例詳解
JavaScript頁面跳轉(zhuǎn)方法包括window.location、超鏈接、meta標簽、history API和表單提交,需區(qū)分相對路徑與絕對路徑,單頁應(yīng)用推薦使用路由庫(如React Router),選擇方式應(yīng)結(jié)合需求與項目架構(gòu),本文給大家介紹JavaScript 文件跳轉(zhuǎn)方法,感興趣的朋友一起看看吧2025-08-08

