什么是call,使用js模拟一个call的原理

什么是call,使用js模拟一个call的原理

让.call前面的函数立即执行 函数的this指向call的第一个参数
// ==========call的基本使用

function fn(){
    console.log(this)
 }
 fn();//window
fn.call()//call没有传参,fn也会执行,fn中的this指向window
 fn.call(123)//传基本数据类型,call内部会包装成对象 {123}
 let obj={name:'hanhan'};
 fn.call(obj)//fn中的this就指向obj
// call传参
 function fn(a,b){
    console.log(this)
     return a+b
 }
 let obj={name:'hanhan'}
 let res=fn.call(obj,1,2)
 console.log(res)

// ===============使用js模拟call原理

// 第一步,先写个立即执行函数
;(function(){
    function mycall(context){
 // 第三步,模拟传参,如果第一个参数是基本数据类型,需要强制类型转成引用数据类型Object
 // 还需要判断是否传参了,这里使用三元运算符表达式。如果有就包装成对象,本身就是对象,包装后也没有影响;如果没有就是window
    context=context?Object(context):window
    // 第四步,this指向fn  context.fn=this 参数的fn属性挂上this
    context.fn=this;
    // 第五步,参数会很多,利用arguments 先定义一个容器去接收 然后for循环遍历arguments
    var args=[];
    // 注意 i=1,要把第一个参数排除掉
    for(var i=1;i<arguments.length;i++){
        args.push(arguments[i])
    }
    //第六步,让fn执行context.fn(),然后进行传参,把数据展开放进去
    // 调用context.fn()时会有返回值,返回这个参数 ...args 利用拓展运算符展开
    let res=context.fn(...args)
    // 第七步,返回之前把前面赋给得fn属性删掉,delete context.fn
    delete context.fn;
    return res;
    }
    // 第二步,把mycall挂到函数的原型对象上
    Function.prototype.mycall=mycall;
 })()
 function fn(a,b){
    console.log(this)
    return a+b
 }
 let obj={name:'hanhan'}
 let res=fn.mycall(obj,1,2)
 console.log(res)
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值