【 函数封装 】bind

封装

	// 函数 对象 实参[数组]
function bind(fn, obj, ...args) {
    // 会返回一个新函数
    // 调用目标函数 并改变this指向

    // 如果此处不带参数的话 那么调用的时候只能成功执行一
    return function () {
    	// 直接调用封装的call函数
    	return call(fn, obj, ...args)
    }

    // 带了参数两个执行方式都可以
    return function (...args2) {
        // 直接调用封装的call函数
        return call(fn, obj, ...args, ...args2)
    }
}
function call(fn, obj, ...args) {
    // 如果这个函数处于非严格模式下
    // 如果对象为 null 或 undefined 时会自动替换为指向全局对象(globalThis)
    if (obj === undefined || obj === null) {
        // 指向全局对象    
        obj = globalThis
    }
    // 添加临时方法
    obj.temp = fn
    // 调用方法
    let result = obj.temp(...args)
    // 删除方法
    delete obj.temp
    // 返回结果
    return result
}

调用

 <script>
        function add(a, b) {
            console.log(this)
            return a + b + this.c
        }
        var obj = {
            c: 50
        }
        window.c = 100

        // 不同的执行方式 取决于封装函数时 是否传递参数
        // 执行一
        let fn = bind(add, obj, 10, 20)
        console.log(fn())

        // 执行二
        let Fn = bind(add, obj)
        console.log(Fn(10, 20))
</script>

结果

• 不传递参数
  
• 传递参数