淺談bind、call、apply區別,使用方法及場景
阿新 • • 發佈:2019-01-11
談到bind、call、apply,首先想到的是改變this全域性上下文指向,但三者的區別,就自己的使用淺談心得。
首先,直接呼叫三個方法並列印,獲取直觀對比,demo程式碼如下:
<script> var objA = { name: '小王', } var objB = { log: function () { return this.name } } console.log(objB.log.bind(objA)) console.log(objB.log.call(objA)) console.log(objB.log.apply(objA)) </script>
控制檯輸出結果如下:
在呼叫bind方法改變this指向時,執行的方法不會執行,而呼叫call方法和apply方法時,在改變this指向的同時,執行的方法也會執行;
除了以上這一直觀的區別外,在使用時傳入入參格式也有區別,demo程式碼如下:
<script> var objA = { name: '小王', } var objB = { log: function (age) { return `${this.name},年齡${age}歲` } } console.log(objB.log.bind(objA, 20)()) console.log(objB.log.call(objA, 20)) console.log(objB.log.apply(objA, [ 20 ])) </script>
控制檯輸出如下:
使用bind方法和call方法時入參格式為逗號分割的入參,使用apply方法時入參格式為一個數組,入參依次為陣列元素,多個入參就在這一陣列中依次新增;
依據個人開發習慣: