es6手写一个call

Posted hellomryk

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了es6手写一个call相关的知识,希望对你有一定的参考价值。

Function.prototype.selfCall = function(ctx, ...args) {
    if(typeof this !== ‘function‘) {
        throw new Error(‘you must use call with function‘)
    }
    ctx = ctx || window
    //强绑定上ctx为执行上下为
    ctx.qdleader = this
    const res = ctx.qdleader(...args);
    //删除这个,防止影响外部对象的正常运行
    delete ctx.qdleader
    return res;
}

还有种es6写法

Function.prototype.call3 = function(context) {
    context = context ? Object(context) : window;
    var fn = Symbol();
    context[fn] = this;
    
    let args = [...arguments].slice(1);
    let result = context[fn](...args);
    
    delete context[fn];
    return result;
}

那不用es6时候是咋写的呢?

Function.prototype.call2 = function(context) {
    //若传入context是null或者undefined时指向window
    //若传入的是原始数据类型,原生的call会调用Object()转换
    context = context ? Object(context):window;
    //创建一个独一无二的fn函数的命名
    var fn = fnFactor(context)
    
    //这里的this就是指调用call的那个函数
    //将调用的这个函数赋值到context种,这样之后执行context.fn的时候,fn里的this就是指向context了
    
    context[fn] = this;
    
    //定义一个用于放arguments的每一项的的字符串:[‘arguments[1]‘,‘arguments[2]‘]
    var args = [];
    //要从第一项开始,第0项是context
    
    for(var i = 1; i < arguemts.length; i ++) {
        args.push("arguments["+ i +"]")
    }
    //使用eval()来执行fn并将args一个个传递进去
    var result = eval("context[fn]("+ args +")")
    delete context[fn];
    
    return result;
}

加群一起进步

 

技术图片

 

以上是关于es6手写一个call的主要内容,如果未能解决你的问题,请参考以下文章

手写JS面试题 --- call apply bind 实现

手写call()

一起手写吧!ES5和ES6的继承机制!

JavaScript高级手写apply()call()bind()

JavaScript高级手写apply()call()bind()

无敌秘籍之 — JavaScript手写代码