JavaScript bind 函数允许返回一个跟源函数一样的绑定函数。绑定函数与源函数区别在与绑定函数的 this 已经被 bind 修改。
函数定义
new Function().bind(this, arg0, arg1…)
代码示例
function sayHello(guest) { console.log('Hello ' + guest + ', I am ' + this.age + ' years old'); } sayHello('Yue'); var me = { name: 'Seven', age: '24' }; var sayHi = sayHello.bind(me); sayHi('Yue');
执行结果
尽管没有通过调用成员方法而是直接执行函数 sayHi(‘Yue’),sayHi 内部的 this 仍然指向了对象 me,而不是默认的 window。
从控制台可以看到 sayHi 已经被“编译”为本地方法。
bind 函数的可选参数 arg0、arg1 等是绑定到源函数对应的第0个参数、第一个参数。执行绑定函数时自动传递已绑定的参数。
与 bind 相比,apply 和 call 方法是在函数执行时改变 this,bind 可以理解为在函数定义时改变 this。
apply、bind、call 对比
函数名 | 参数列表 | 说明 |
apply | (this_arg, arguments_array) | 调用函数,通过 this_arg 替代源函数默认的 this,arguments_array 是传递给函数的参数列表
var A = { name: 'A', sayHi: function(guest) { console.log('Hi ' + guest + ', I am ' + this.name); } } var me = {name: 'Seven'}; A.sayHi('Yue'); A.sayHi.apply(me, ['Yue']); |
bind | (this_arg, arg0, arg1…) | 创建与源函数函数体一样的绑定函数,并根据 this_arg 和 arg0、arg1 等分别修改绑定函数的 this 和 默认参数 |
call | (this_arg, arg0, arg1…) | 调用函数,通过 this_arg 替代源函数默认的 this,arg0、arg1 等是传递给函数的参数列表
var A = { name: 'A', sayHi: function(guest) { console.log('Hi ' + guest + ', I am ' + this.name); } } var me = {name: 'Seven'}; A.sayHi('Yue'); A.sayHi.call(me, 'Yue'); |