函数中的this是在运行时候决定的,而不是函数定义时,有下列几种情况
1、全局环境中的this指window
2、其他函数中的this指向调用它的对象
3、在构造函数里用new调用,指向创建的新实例对象
4、使用call和apply改变函数中this的具体指向
apply的参数需要放在一个数组里面
bind改变this指向 返回函数调用执行
三个方法都是原型上
call
Function.prototype.mCall = function(ctx, ...arg) {
var fnname = this.name + Math.floor(Math.random() * 100) //fn()这个函数名避免重复
ctx[fnname] = this; //把fn这个函数到ctx上
ctx[fnname](...arg); //调用一下这个函数,传入的实参
delete ctx[fnname]; //删除这个fn函数
}
var obj = {
name: '张三',
age: '80'
}
var a = {
name: '1',
age: '10',
fn(na, ag) {
console.log(this.name, this.age, na, ag);
}
}
a.fn.mCall(obj, 1, 2); // 张三 80 1 2
Apply
Function.prototype.mApply = function(ctx, arr) {
var ctx = ctx || window;
ctx.fn = this; //ctx挂一个fn函数
if (!arr) { //判断传入的是不是一个数组
var result = ctx.fn(); //给fn这个函数付给一个变量
delete ctx.fn; //删除这个函数
return result; //把结果返出去
} else { //如果是数组的话
var len = arr.length, // 把arr的长度赋给变量
args = []; //声明一个空数组
for (var i = 0; i < len; i++) { //循环这个数组
args.push('arguments[1][' + i + ']'); //arguments代表实参集合,把它每一项放到空数组里
}
var result = eval('ctx.fn(' + args.join(',') + ')'); //eval()是把拼接的字符以函数形式表达出来
delete ctx.fn; //删除这个fn函数
return result; //把结果返出去
}
}
var obj = {
name: '张三',
age: '80'
}
var a = {
name: '1',
age: '10',
fn(na, ag) {
console.log(this.name, this.age, na, ag);
}
}
a.fn.mApply(obj, ['ha', 'he']); //张三 80 ha he
bind
Function.prototype.mBind = function(ctx, ...arg) {
ctx = ctx || window;
var self = this; //把this赋给一个变量
return function() { 、、返回一个函数
return self.call(ctx, ...arg.concat(...arguments)) //调用call的方法改变this指向
}
}
var obj = {
name: '张三',
age: '80'
}
var a = {
name: '1',
age: '10',
fn(na, ag) {
console.log(this.name, this.age, na, ag);
}
}
a.fn.mBind(obj,1,2)(); //因为返回的是一个函数所以需要调用
以上就是我的一些理解,如果有更深入的想法可以交流一下