手写call()

Posted smart-girl

tags:

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

call() 方法使用一个指定的 this 值和单独给出的一个或多个参数来调用一个函数
语法:function.call(thisArg, arg1, arg2, ...)
call()的原理比较简单,由于函数的this指向它的直接调用者,我们变更调用者即完成this指向的变更:

//变更函数调用者示例
function foo() {
    console.log(this.name)
}

// 测试
const obj = {
    name: ‘写代码像蔡徐抻‘
}
obj.foo = foo   // 变更foo的调用者
obj.foo()       // ‘写代码像蔡徐抻‘

基于以上原理, 我们两句代码就能实现call()

Function.prototype.myCall = function(thisArg, ...args) {
    thisArg.fn = this              // this指向调用call的对象,即我们要改变this指向的函数
    return thisArg.fn(...args)     // 执行函数并return其执行结果
}

但是我们有一些细节需要处理:

Function.prototype.myCall = function(thisArg, ...args) {
    if(typeof this !== ‘function‘) {
        throw new TypeError(‘error‘)
    }
    const fn = Symbol(‘fn‘)        // 声明一个独有的Symbol属性, 防止fn覆盖已有属性
    thisArg = thisArg || window    // 若没有传入this, 默认绑定window对象
    thisArg[fn] = this              // this指向调用call的对象,即我们要改变this指向的函数
    const result = thisArg[fn](...args)  // 执行当前函数
    delete thisArg[fn]              // 删除我们声明的fn属性
    return result                  // 返回函数执行结果
}

//测试
foo.myCall(obj)     // 输出‘写代码像蔡徐抻‘

本文转载自:https://juejin.im/post/5e8b261ae51d4546c0382ab4

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

面试必备!JS:call详解以及自己手写call

面试必备!JS:call详解以及自己手写call

面试必备!JS:call详解以及自己手写call

手写数字识别——基于全连接层和MNIST数据集

前端面试题之手写promise

手写callapplybind函数和arguments&数组函数slice的实现