当前位置:网站首页>Manually implement call, apply and bind functions
Manually implement call, apply and bind functions
2022-04-23 17:14:00 【MiMenge】
Realization call
Function.prototype.myCall = function (targetObj, ...resule) {
// Judge whether the incoming object exists
targetObj = targetObj || window;
// Hang on to the incoming object this Point to , here this To call myCall function
targetObj.fn = this;
// Call... Internally using an incoming object fn Method , This enables changes this Point to , Point to the target object that is passed in
let value = eval('targetObj.fn(...resule)');
// Delete target object fn Method
delete targetObj.fn
// Returns the result of the call
return value;
}
let obj = {
uname: 'Tom'
}
function demo(a, b){
console.log(this.uname, a, b);
}
demo();// undefined undefined undefined
demo.myCall(obj, 1, 2);
// Tom 1 2
Realization apply ( Subject and call almost , Different ways of passing in parameters )
Function.prototype.myApply = function (targetObj, resule) {
targetObj = targetObj || window;
targetObj.fn = this;
let value = eval('targetObj.fn(...resule)');
delete targetObj.fn
return value;
}
let obj = {
uname: 'Tom'
}
function demo(x, y){
console.log(this.uname, x, y);
}
demo();// undefined undefined undefined
demo.myApply(obj, [1, 2]);
// Tom 1 2
Realization bind
Function.prototype.myBind = function (targetObj, ...resule) {
// Determine whether the called object is a function
if (typeof this !== "function") {
throw new Error("this must be a function");
}
// Create variables to save this Point to
// here this Point to the function called externally
let self = this;
// The function to be created returns
let backFunc = function () {
// First determine the of the calling object this Whether it is the same as this function this
// Yes, change this Point to yourself ,( In fact, the last thing to return is this A function that points to itself )
// If not, change the caller this Point to the incoming object , Pass the parameter to the calling this in .
self.apply(this instanceof self ?
this : targetObj, resule.concat(Array.prototype.slice.call(arguments)));
}
// Judge whether the call has a prototype
if(this.prototype) {
// If so, assign the prototype to the returned function
backFunc.prototype = Object.create(this.prototype);
}
// Return function
return backFunc;
}
let obj = {
uname: 'Tom'
}
function demo(x, y){
console.log(this.uname, x, y);
}
demo();// undefined undefined undefined
demo.myBind(obj, 1, 2)();
// Tom 1 2
版权声明
本文为[MiMenge]所创,转载请带上原文链接,感谢
https://yzsam.com/2022/04/202204230553027792.html
边栏推荐
- Shell script -- shell programming specification and variables
- JSON deserialize anonymous array / object
- Baidu Map Case - modify map style
- Shell-sed命令的使用
- ASP. Net core JWT certification
- 手写事件发布订阅框架
- .Net Core3. 1 use razorengine NETCORE production entity generator (MVC web version)
- Preliminary understanding of promse
- BUG_ me
- Net standard
猜你喜欢
Signalr can actively send data from the server to the client
自定义my_strcpy与库strcpy【模拟实现字符串相关函数】
Path environment variable
[PROJECT] small hat takeout (8)
ASP. NET CORE3. 1. Solution to login failure after identity registers users
Perception of linear algebra 2
【WPF绑定3】 ListView基础绑定和数据模板绑定
[registration] tf54: engineer growth map and excellent R & D organization building
Grpc gateway based on Ocelot
Bottom processing of stack memory in browser
随机推荐
手写事件发布订阅框架
Variable length parameter__ VA_ ARGS__ Macro definitions for and logging
Rtklib 2.4.3 source code Notes
Shell-cut命令的使用
线性代数感悟之2
.Net Core3. 1 use razorengine NETCORE production entity generator (MVC web version)
C listens for WMI events
[C#] 彻底搞明白深拷贝
Shell-sort命令的使用
1-2 JSX syntax rules
ClickHouse-表引擎
Path environment variable
ASP. Net core dependency injection service life cycle
Your brain expands and shrinks over time — these charts show how
JS to find the character that appears three times in the string
Kingdee Cloud Star API calling practice
[problem solving] [show2012] random tree
Milvus 2.0 質量保障系統詳解
MySQL restores data through binlog file
tidb-server 的配置文件在哪里?