首先说一下bind,灵活的通过bind来改变this指针
bind方法会创建一个新函数,称为绑定函数.当调用这个绑定函数时,绑定函数会以创建它时传入bind方法的第一个参数作为this,
传入bind方法的第二个以及以后的参数加上绑定函数运行时本身的参数按照顺序作为原函数的参数来调用原函数.
首先bind是Function下的函数
var pp = { name: 'wk', show: function () { console.log(this.name) } };
如果给按钮绑定事件
这样写的话就有问题,因为show里面的this是button对象,将返回''
document.getElementById('btn').addEventListener("click", pp.show);
document.getElementById('btn').onclick = pp.show;
document.getElementById('btn').addEventListener("click", function () {
pp.show();
});
document.getElementById('btn').addEventListener("click", pp.show.bind(pp));
function people() {
this.name = 'wk';
this.salary = 6000;
}
people.prototype.addSalary = function (address) {
if (address) {
console.log(address);
}
window.setTimeout((function () {
var newsalary = this.salary + 1000;
console.log('原工资为:' + this.salary + ',过了一秒后,工资为:' + newsalary);
}).bind(this), 1000);
}
var p1 = new people();
p1.addSalary();
p1.addSalary.call(p1, '北京');
var ordata = { age: 12 };
function showdata() {
console.log(this.age);
}
//showdata(); undefined ×
showdata.bind(ordata)();//12 √
var arr = [1, 4, 67, 23];
console.log(arr.slice(2, 4)); //[67,23]
我们把这个方法提起出来
var getSlice = Array.prototype.slice;
现在要执行getSlice这方法getSlice(),需要this
console.log(getSlice.call(arr, 2, 4));
console.log(getSlice.apply(arr, [2, 4]));
console.log(getSlice.bind(arr, 2, 4)());//都是一样的
apply和call以及bind都是Function.prototype下的