Javascript动手实现call,bind,apply的代码详解

Javascript动手实现call,bind,apply的代码详解

1.检查当前调用的是否为函数

2.如果当前没有传入指向的this,则赋值为window

3.将fn指向当前调用的函数

4.获取传入的参数

5.将参数传入fn进行调用

6.将对象上的fn删除

7.返回结果

//普通call的实现 function hello(){ console.log('hello 我是'+this.name); }; let person = { name:'krys' }; var name = 'liang';//只有var的变量属于window hello();// 'hello 我是liang' hello.call(person);//'hello 我是krys' hello.call();//'hello 我是liang' let person2 = { name:'lwl' } Function.prototype.mycall = function(context){ //不传入参数的时候,默认为window if(typeof this !== "function"){ throw new TypeError('Error'); } context = context || window; context.fn = this;//fn就是上面的hello方法 const args = [...arguments].slice(1);//第一个参数不要 const result = context.fn(...args);//把剩下的其他参数传给hello delete context.fn; return result; } hello.mycall(person2); function getParams(){ console.log('我是',this.name,'获取一些参数',...arguments); } let person3 = { name:'hhh' }; getParams.apply(person3,['hello','world']) Function.prototype.myApply = function(context){ if(typeof this !== "function"){ throw new TypeError() } context = context || window; context.fn = this; let result; if(arguments[1]){ //如果有传入参数数组 console.log(arguments[1]) result = context.fn(...arguments[1]); }else{ result = context.fn(); } delete context.fn; return result; } getParams.myApply({name:'llll'},['jjj','kkkk','llll']); function getParams(){ console.log('我是',this.name,'获取一些参数',...arguments); } let person3 = { name:'hhh' }; let person4 = { name:'tttt' }; getParams.bind(person3,'hello','world') getParams.bind(person4,'hello','world')('jjj','kkk'); Function.prototype.myBind = function(context){ if(typeof this !== "function"){ throw new TypeError() } context = context || window; const _that = this; const args = [...arguments].slice(1); return function F(){ if(this instanceof F){ return new _that(...args,...arguments);//这里的arguments是上面的jjj kkk } return _that.apply(context,args.concat(...arguments));//这里的arguments是上面的jjj kkk } } getParams.myBind({name:'llll'},'jjj','kkkk','llll')('hhhhllll'); 总结

本篇文章就到这里了,希望能够给你带来帮助,也希望您能够多多关注易知道(ezd.cc)的更多内容!  

推荐阅读

    call和called的用法与区别

    call和called的用法与区别,意思,分词,本文目录call和called的用法与区别be called 和called 区别,“被称为”应该用哪个call 与called的用

    Javascript中 toFixed四舍六入方法

    Javascript中 toFixed四舍六入方法,浮点,手动,银行家,进,javascript中toFixed使用的是银行家舍入规则。银行家舍入:所谓银行家舍入法,其实

    grammatically是什么意思

    grammatically是什么意思,英文,语法,本文目录grammatically是什么意思grammatical dinosaurs是啥意思construct grammatically可以用这种

    javascript怎么隐藏元素值

    javascript怎么隐藏元素值,隐藏,元素,设置,显示,位置,属性,javascript隐藏元素值的方法:1、设置元素style属性中的display,语句如“t.style.displ

    javascript对象怎么转换成字符串

    javascript对象怎么转换成字符串,字符串,参数,对象,序列化,属性,数组,在javascript中可以使用“JSON.stringify()”方法将对象转换成字符串,其语

    javascript怎么将字母转为小写

    javascript怎么将字母转为小写,方法,字符串,函数,语法,主机,语言,javascript字母转为小写的方法:1、使用toLowerCase()函数,语法“string.toLower

    javascript怎么实现二维码

    javascript怎么实现二维码,二维码,二维码生成,下载,插件,扫描二维码,操作,javascript实现二维码的方法:1、下载qrcodejs插件;2、使用qrcode实现二

    javascript如何获取字符串长度

    javascript如何获取字符串长度,字符,获取,属性,字符串长度,字符串,输出,javascript获取字符串长度的方法:1、使用length属性按字符来获取字符串

    javascript怎么类型转换

    javascript怎么类型转换,方法,字符串,转换,转换成,类型,数字,方法:1、使用“+”运算符自动进行转换。2、使用JS内置的函数进行转换,例toString()

    javascript如何去掉空格

    javascript如何去掉空格,去除,替换,方法,删除,文本,字符串,javascript去掉空格的方法:1、通过“str.replace(/\s+/g,"");”去除所有空格;2、通