您好,欢迎来到保捱科技网。
搜索
您的当前位置:首页手写一个bind函数(大概)

手写一个bind函数(大概)

来源:保捱科技网

昨天搜了下bind怎么实现,大家都在说bind的特征啊啥的,没搜到,今天有人问起来,我反问他要咋搜,他和我说柯里化。柯里化!!!它的最常用的表现形式不就是传说中的的其中一种嘛!!!

I think! I can do it!!!我觉得我可以尝试着实现一下。

apply的实现

首先我们来回想this指向的几种可能性:

想想我们可以使用可能性1,先来写个aplly方法:

先写个实验用具:

function sum(a, b) {
    return this.a + this.b
}
let obj1 = {
    a: 11,
    b: 7
}
let obj2 = {
    a: 1,
    b: 1,
}
复制代码

再写个初版仿生myApply:

function myApply(that, arg){ //接受that参数参数,作为未来this
    that = JSON.parse(JSON.stringify(that)) //给做个深拷贝,不影响原来的对象
    that.Fn = this  //给对象设置属性Fn,让它等于我们前面调用myApply的sum
    return that.Fn(...arg)  //用属性调用的方式执行函数,让this指向传入的that,放入参数
}
复制代码

但这么写有个问题,我们希望在sum里面对this进行操作的时候,作为this源的对象也跟着改动,所以我们那么写:

function myApply(that, arg = []){
    that = that!== null && typeof that === 'object'?that: {} //在this不为object时的处理
    that.Fn = this
    const result = that.Fn(...arg)
    delete that.Fn //使用完之后对that下的Fn进行删除
    return result
}
复制代码

完成后我们将myApply放到Function的原型上并测试看看它:

Function.prototype.myApply = myApply

console.log(sum1.myApply(obj1)) //18
console.log(sum2.myApply(null, [2, 3])) //5
复制代码

到这里apply方法就算写完了。

bind的实现

接下来我们要用到柯里化形式的闭包来保存下bing函数调用时的this和传进来的参数,以便在返回函数中用到它们:

function myBind(that, ...arg) { //创建时保存bind中传进来的arg
    const _Fn = this    //保存sum函数
    return function () {
        const args = [...arg, ...arguments]   //合并两次传递进来的参数
        return _Fn.myApply(that, args)  //调用sum函数的myApply方法
    }
}
复制代码

和前面一样,将myBind放到Function的原型上,并测试它:

Function.prototype.myBind = myBind

const sum3 = sum1.myBind(obj1)
console.log(sum3()) //18
const sum4 = sum1.myBind(obj1).myBind(obj2)
console.log(sum4()) //18

const sum5 = sum2.myBind(obj1, 5)
console.log(sum5(6)) //11
复制代码

因篇幅问题不能全部显示,请点此查看更多更全内容

Copyright © 2019- baoaiwan.cn 版权所有 赣ICP备2024042794号-3

违法及侵权请联系:TEL:199 18 7713 E-MAIL:2724546146@qq.com

本站由北京市万商天勤律师事务所王兴未律师提供法律服务