当前位置:网站首页>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
边栏推荐
猜你喜欢
Signalr can actively send data from the server to the client
[PROJECT] small hat takeout (8)
[registration] tf54: engineer growth map and excellent R & D organization building
Milvus 2.0 質量保障系統詳解
Solution architect's small bag - 5 types of architecture diagrams
基于51单片机红外无线通讯仿真
Get the column name list of the table quickly in Oracle
01-初识sketch-sketch优势
C语言函数详解
Scope and scope chain in JS
随机推荐
ASP. Net core reads the configuration file in the class library project
Change the password after installing MySQL in Linux
[WPF binding 3] listview basic binding and data template binding
Feign report 400 processing
Detailed explanation of Milvus 2.0 quality assurance system
Promise (I)
EF core in ASP Generate core priority database based on net entity model
JS to find the character that appears three times in the string
Solution of Navicat connecting Oracle library is not loaded
01-初识sketch-sketch优势
CentOS MySQL multi instance deployment
. net type transfer
Abnormal resolution of Xiaomi camera
ASP. Net core dependency injection service life cycle
Production environment——
Input file upload
Redis docker installation
1-1 NodeJS
Self use learning notes - connectingstring configuration
Expression "func" tSource, object "to expression" func "tSource, object" []