详解JS中 call 方法的实现

摘要:本文将全面的,详细解析call方法的实现原理

本文分享自华为云社区《关于 JavaScript 中 call 方法的实现,附带详细解析!》,作者:CoderBin。

我们提供的服务有:网站制作、成都网站建设、微信公众号开发、网站优化、网站认证、玛沁ssl等。为千余家企事业单位解决了网站和推广的问题。提供周到的售前咨询和贴心的售后服务,是有科学管理、有技术的玛沁网站制作公司

本文将全面的,详细解析call方法的实现原理,并手写出自己的call方法,相信看完本文的小伙伴都能从中有所收获。

call 方法的实现

1.函数作用

调用函数,可传入参数,改变this指向

2.总体步骤

  1. 边界判断(this,context)
  2. 将调用的函数设置为对象(传入的context)的方法(改变this指向)
  3. 调用函数,得到返回值,并返回

3. 详细步骤

1. 边界判断

  • 判断当前 this 是否为一个函数,否则返回错误消息
  • 判断传入的 context 参数是否存在,存在则使用 Object() 转换为对象赋给 context,否则将 window 赋值给 context

2. 将调用的函数设置为对象(传入的context)的方法(改变this指向)
3. 调用函数,得到返回值,并返回

  • 调用函数,得到结果
  • 删除 context 身上的 fn 函数
  • 返回结果

4. 代码实现

/**
 * !实现 binCall() 方法
 * @param {*} context 绑定的对象
 * @param  {...any} args 剩余参数
 * @returns 
*/
Function.prototype.binCall= function(context, ...args) {
if (typeof this !== 'function') console.error('type Error'); // 1
  context = (context!==null && context!==undefined) ? Object(context) : window
 context.fn= this // 2
 const result = context.fn(...args) // 3
 delete context.fn;
return result
}

当前文章:详解JS中 call 方法的实现
网站URL:http://lszwz.com/article/dsojgdc.html

其他资讯

售后响应及时

7×24小时客服热线

数据备份

更安全、更高效、更稳定

价格公道精准

项目经理精准报价不弄虚作假

合作无风险

重合同讲信誉,无效全额退款