手撸call apply bind
25-04-07 04:43
615
0
如果自己去实现call apply bind,看上去挺复杂,写起来其实就几行代码 因为call和apply一样,只是传参不一样,所以我就只写一个call
实现call(其实只有2行代码)
/* 随便定义一个对象,待会将函数内的this指向指向倒这个对象 */ const obj = { name: "我是需要被绑定改变this指向的对象" }; /* 需要改变this指向的函数,没有使用call时,this指向window */ function fn(arg) { console.log("fn---------", this); console.log("fn---------", arg); } /* * * 重写call方法 * target 需要把this改变到哪个目标 * args 传递进来的参数 */ Function.prototype.call = function (target, ...args) { /* 这里的this就指向上面的fn函数 */ console.log(this); /* 随便定义一个变量,用于在目标对象里存fn函数,这里使用symbol更好 */ target["vhan"] = this; /* 这样target目标上就有个vhan的属性,并且属性值就是fn函数 */ console.log(target); /* 调用这个vhan,并把参数传入进去就实现this改变了 */ target["vhan"](args); /* 防止给target上多出多余没用的参数,在将vhan删除掉 */ delete target["vhan"]; }; fn.call(obj, "我是大帅哥");
实现bind
因为bind的调用方式,是返回一个新函数,在调用一次,例如:fn.bind(null)(options),所以需要用到高阶函数
/* 随便定义一个对象,待会将函数内的this指向指向倒这个对象 */ const obj = { name: "我是需要被绑定改变this指向的对象" }; /* 需要改变this指向的函数,没有使用call时,this指向window */ function fn(arg) { console.log("fn---------", this); console.log("fn---------", arg); } /* * * 重写call方法 * target 需要把this改变到哪个目标 * args 传递进来的参数 */ Function.prototype.bind = function (target) { target["vhan"] = this; /* 这里使用高阶函数接收参数 */ return (...args) => { target["vhan"](args); delete target["vhan"]; }; }; fn.bind(obj)("我是大帅哥!!!");
-
资源素材解析系统网站源码
设计资源素材解析系统网站源码 支持N个平台教程在压缩包里面很详细。包括了网站设置与获取cookie等详细教程 443 0 21-07-05 -
教你查询手机号绑定了哪些平台
因为套餐费用过高、号码不理想以及不打算继续使用,决定换掉多年来一直在使用的电话号码。然而,这个手机号码与许多互联网账号绑定在一起,... 1183 0 24-07-10 -
中学教师资格考试综合素质模拟卷
2022下半年全国教师资格统考体育与健康《学科知识与教学能力》模拟卷一(初级中学).pdf.pdf2022下半年全国教师资格统考体育与健康《学科知... 1721 0 24-08-20 -
如何去除上网冲浪的广告
上网冲浪去广告这件事,广告这种东西一直都有,包括我这篇文章底部的小卡片也是广告,因为很多时候我们并不可能一直为爱发电,(你们点击下... 759 0 25-03-10 -
托福资料(完整带Java后台)
【托福资料(完整带Java后台)】这是一份包含了托福备考资源与Java后台技术的综合资料包,旨在为学习者提供全面的托福考试准备以及Java编程... 1232 0 24-09-11 -
实现数组扁平化的 6 种方式
来聊聊数组相关的应用——如何实现数组扁平化。数组扁平化在一些多维数组的应用场景中会出现,我将围绕 6 种方式来带你实现它。此外,关... 892 0 24-05-24 -
系统稳定,如何监控和保护进程安全
在开始本讲之前,我们先了解一个特点,在前端因为某些用户的特殊性,导致的逻辑 Bug 会造成这个用户服务异常,但是在服务端如果没有做好... 1114 0 24-05-24 -
音乐播放器小程序源码带Java后端
本系统包含微信小程序前台和Java做的后台管理系统,该后台采用前后台前后分离的形式使用Java+VUE微信小程序——前台涉及技术:WXML 和 WX... 1139 0 24-06-02
发表我的评论
共0条评论
- 这篇文章还没有收到评论,赶紧来抢沙发吧~