码字不易,有帮助的同学希望能关注一下我的微信公众号:Code程序人生,感谢!代码自用自取。
之前的系列中,跟着大家重写了数组常用的一些内置方法,今天给大家重写一下call
方法,这个也是面试非常非常频繁出现的考察点。
首先按照惯例我们看一下原生的call
方法的使用:
function test () {
console.log(typeof(this));
console.log(this);
console.log(arguments)
}
test.call({
a:1,
b:2
},'微信公众号','Code程序人生');
我们写了一个test方法,里面分别输出了一下this
的类型,this
,arguments
。在方法外部,我们调用了函数的call
方法,并且传入了第一个参数:一个对象,第二三个参数都是普通字符串。
我们看下控制台的输出:
首先this
的类型是object
,然后this
指向的是调用call
方法的时候传入的第一个参数,arguments
是调用call
方法的时候传入的第二和第三个参数。
这是我们大概就可以知道call
方法的作用,第一个参数会改变函数的this
指向,剩下的参数都是函数的参数列表。并且传入的第一个参数无论是什么类型,都会变成object
类型。
我们再试一下
test.call(1,'微信公众号','Code程序人生');
我们传入了一个数值1
,方法内的this
指向了这个1
,并且类型还是object
。
ok,我们大概知道了原生call
方法的使用,下面我们重写一下。
Function.prototype.myCall = function (ctx) {
ctx = ctx ? Object(ctx) : window;
ctx.originFn = this;
var args = [];
for (var i = 1; i < arguments.length; i++) {
args.push('arguments[' + i + ']');
}
eval('ctx.originFn(' + args + ')');
delete ctx.originFn;
}
测试一下:
function test () {
console.log(typeof(this));
console.log(this);
console.log(arguments);
}
test.myCall({
a:1,
b:2
},'微信公众号','Code程序人生')
没有任何的问题。
对于myCall
方法的实现有任何疑问的,或者觉得代码逻辑有问题的,可以加我联系方式讨论指定。
有微信小程序课设、毕设需求联系个人QQ:505417246
关注下面微信公众号,可以领取微信小程序、Vue、TypeScript、前端、uni-app、全栈、Nodejs、Python等实战学习资料
最新最全的前端知识总结和项目源码都会第一时间发布到微信公众号,请大家多多关注,谢谢
关注公众号后,回复前端面试题,领取大量前端面试题汇总pdf资料