当前位置:网站首页>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
边栏推荐
- On lambda powertools typescript
- Scope and scope chain in JS
- Use of Shell sort command
- Promise (III)
- Oninput one function to control multiple oninputs (take the contents of this input box as parameters) [very practical, very practical]
- JS to find the character that appears three times in the string
- 【解决报错】Error in v-on handler: “TypeError: Cannot read property ‘resetFields’ of undefined”
- Shell脚本——Shell编程规范及变量
- [PROJECT] small hat takeout (8)
- ASP. Net core configuration options (Part 1)
猜你喜欢
Shell脚本——Shell编程规范及变量
[registration] tf54: engineer growth map and excellent R & D organization building
JS, entries(), keys(), values(), some(), object Assign() traversal array usage
Node access to Alipay open platform sandbox to achieve payment function
Scope and scope chain in JS
Solution architect's small bag - 5 types of architecture diagrams
Clickhouse table engine
Detailed explanation of the penetration of network security in the shooting range
[PROJECT] small hat takeout (8)
Grpc gateway based on Ocelot
随机推荐
Shell-awk命令的使用
Baidu Map Case - modify map style
Lock锁
El cascade and El select click elsewhere to make the drop-down box disappear
. net type transfer
SPC introduction
Perception of linear algebra 2
Shell-sort命令的使用
VLAN高级技术,VLAN聚合,超级Super VLAN ,Sub VLAN
SQL: How to parse Microsoft Transact-SQL Statements in C# and to match the column aliases of a view
Path environment variable
Using quartz under. Net core -- a simple trigger of [7] operation and trigger
Paging the list collection
C dapper basically uses addition, deletion, modification and query transactions, etc
1-3 components and modules
About stream flow, write it down briefly------
Baidu Map 3D rotation and tilt angle adjustment
Promise (IV)
Input file upload
1-3 nodejs installation list configuration and project environment