ES6參考---call、apply和bind
一、總結
一句話總結：
bind和call與apply的區別是不會立即調用函數，常用於改變回調函數的參數，bind的參數傳遞方式和call一樣
<script type="text/javascript"> function fun(age) { this.name = 'kobe'; this.age = age; console.log('dddddddddddddd'); } var obj = {}; fun.bind(obj, 12)(); console.log(obj);//{name: "kobe", age: 12} console.log(obj.name, obj.age); setTimeout(function () { console.log(this);//obj //{name: "kobe", age: 12} }.bind(obj),2000); </script>
1、bind的參數傳遞和call已經apply里面的哪一個一樣？
bind的參數傳遞方式和call一樣
2、bind()常用的用途是什么？
改變回調函數的this，bind是改變對象且不立即執行，為回調函數也是不立即執行
3、bind()改變回調函數的this指向的實例？
調用匿名函數的bind方法直接改變this：setTimeout(function () {}.bind(obj),2000);
<script type="text/javascript"> function fun(age) { this.name = 'kobe'; this.age = age; console.log('dddddddddddddd'); } var obj = {}; fun.bind(obj, 12)(); console.log(obj);//{name: "kobe", age: 12} console.log(obj.name, obj.age); setTimeout(function () { console.log(this);//obj //{name: "kobe", age: 12} }.bind(obj),2000); </script>
4、Function.prototype.bind(obj)作用？
fn.bind(obj)將函數內的this綁定為obj, 並將函數返回
function fun(age) { this.name = 'kobe'; this.age = age; console.log('dddddddddddddd'); } var obj = {}; fun.bind(obj, 12)(); console.log(obj);//{name: "kobe", age: 12} console.log(obj.name, obj.age);
二、call、apply和bind
博客對應課程的視頻位置：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>05_Function擴展</title> 6 </head> 7 <body> 8 <!-- 9 1. Function.prototype.bind(obj) : 10 * 作用: 將函數內的this綁定為obj, 並將函數返回 11 2. 面試題: 區別bind()與call()和apply()? 12 * 都能指定函數中的this 13 * call()/apply()是立即調用函數 14 * bind()是將函數返回 15 --> 16 <script type="text/javascript"> 17 function fun(age) { 18 this.name = 'kobe'; 19 this.age = age; 20 console.log('dddddddddddddd'); 21 } 22 var obj = {}; 23 fun.bind(obj, 12)(); 24 console.log(obj);//{name: "kobe", age: 12} 25 console.log(obj.name, obj.age); 26 27 setTimeout(function () { 28 console.log(this);//obj //{name: "kobe", age: 12} 29 }.bind(obj),2000); 30 31 </script> 32 </body> 33 </html>
