当前位置:网站首页>Call, apply, bind rewrite, easy to understand with comments
Call, apply, bind rewrite, easy to understand with comments
2022-07-06 06:46:00 【Carpool steed】
Don't talk too much nonsense, just go to the code , Please point out any errors and problems
call Realization
;(() => {
Function.prototype.myCall = function (ctx) {
ctx = ctx ? Object(ctx) : window
// take Add an object above the parameter object , So make sure that ctx It's the object
ctx.pointer = this
// Declare an empty array
const param = []
for (let i = 1; i < arguments.length; i++) {
param.push(`arguments[${
i}]`)
}
// Receive the return value of the next norm
const ret = eval(`ctx.pointer(${
param.toString()})`)
// Delete the newly added attribute above
delete ctx.pointer
// Go back out again
return ret
}
// test
function test() {
console.log(this, arguments)
return 'value'
}
test.myCall({
a: 1, b: 2 }, ' Parameters 1', ' Parameters 2')
})()
apply Realization
;(() => {
Function.prototype.myApply = function (ctx, args) {
ctx = ctx ? Object(ctx) : window
let ret
// take Add an object above the parameter object , So make sure that ctx It's the object
ctx.pointer = this
// Judge args type
const type = Object.prototype.toString.call(args).slice(8, -1)
if (type === 'Array') {
// Receive the return value of the next norm , utilize ... Expand expression expand parameter
ret = eval('ctx.pointer(...args)')
// Delete the newly added attribute above
delete ctx.pointer
} else if (
type === 'Null' ||
type === 'Undefined' ||
type === 'Function'
) {
ret = eval('ctx.pointer()')
// Delete the newly added attribute above
delete ctx.pointer
} else {
throw new TypeError('CreateListFromArrayLike called on non-object')
}
// Go back out again
return ret
}
// test
function test() {
console.log(this, arguments)
return 'value'
}
test.myApply({
a: 1, b: 2 }, function () {
})
})()
bind Realization : This is a bit hard to understand , Just look at the note number
// characteristic :
// 1 . Returns a new function
// 2. bind -> The first parameter -> change this Point to
// 3. Receive parameter separation
// 4.bind and call Function parameters are passed in the same way
// 5. Instantiate the new function returned -> this. The point is test Constructed instance
// 6. Instances should inherit test Prototype on constructor
Function.prototype.myBind = function (ctx) {
// 1. preservation this
const pointer = this
// 2. Parameters passed for the first time
const params = [].slice.call(arguments, 1)
// Create a new intermediate function for Assignment prototype
const _typeFn = function () {
}
// Return new function
const newFn = function (param) {
// 3.param Parameters passed for the second time utilize concat Splicing
const args = params.concat(param)
// 4. Call function If test If there is a return value, you need to return 5. Judge this
return pointer.apply(this instanceof newFn ? this : ctx, args)
}
// 6. Copy prototype
_typeFn.prototype = pointer.prototype
newFn.prototype = new _typeFn()
return newFn
}
// test
function test(user, car) {
console.log(this)
console.log(user + ' Just bought one ' + car + ' vehicle ')
}
test.prototype.fun = ' Method '
const t = test.myBind({
a: 1, b: 2 }, ' Zhang San ')
const t1 = new t(' Mercedes ')
console.log(t1)
Try to integrate ideas into development , cheer up !!!
边栏推荐
- The internationalization of domestic games is inseparable from professional translation companies
- [unity] how to export FBX in untiy
- Data security -- 13 -- data security lifecycle management
- Number of query fields
- [brush questions] how can we correctly meet the interview?
- How much is the price for the seal of the certificate
- 国产游戏国际化离不开专业的翻译公司
- Suspended else
- Explain in detail the functions and underlying implementation logic of the groups sets statement in SQL
- A 27-year-old without a diploma, wants to work hard on self-study programming, and has the opportunity to become a programmer?
猜你喜欢
SAP SD发货流程中托盘的管理
今日夏至 Today‘s summer solstice
端午节快乐Wish Dragon Boat Festival is happy
Luogu p2089 roast chicken
女生学软件测试难不难 入门门槛低,学起来还是比较简单的
SQL Server Manager studio (SSMS) installation tutorial
(practice C language every day) reverse linked list II
如何做好金融文献翻译?
CS通过(CDN+证书)powershell上线详细版
Reflex WMS medium level series 3: display shipped replaceable groups
随机推荐
云服务器 AccessKey 密钥泄露利用
成功解决TypeError: data type ‘category‘ not understood
Summary of leetcode's dynamic programming 4
AttributeError: Can‘t get attribute ‘SPPF‘ on <module ‘models.common‘ from ‘/home/yolov5/models/comm
Fedora/REHL 安装 semanage
Biomedical localization translation services
Every API has its foundation when a building rises from the ground
Automated test environment configuration
Day 246/300 ssh连接提示“REMOTE HOST IDENTIFICATION HAS CHANGED! ”
How effective is the Chinese-English translation of international economic and trade contracts
Simple query cost estimation
Changes in the number of words in English papers translated into Chinese
SSO流程分析
Leetcode - 152 product maximum subarray
Biomedical English contract translation, characteristics of Vocabulary Translation
Do you really know the use of idea?
查询字段个数
利用快捷方式-LNK-上线CS
[English] Verb Classification of grammatical reconstruction -- English rabbit learning notes (2)
Suspended else