美文网首页
js的bind方法实现

js的bind方法实现

作者: 一代码农1970 | 来源:发表于2020-09-21 14:25 被阅读0次

    bind方法介绍

    bind() 方法会创建一个新函数。当这个新函数被调用时,bind() 的第一个参数将作为它运行时的 this,之后的一序列参数将会在传递的实参前传入作为它的参数。
    例子:

            var foo = {
                value: 'abc'
            }
            function bar(a, b) {
                console.log(this.value)
                console.log(a)
                console.log(b)
            }
            var bindFoo = bar.bind(foo,1)
            bindFoo(2) // 输出  abc 1 2
    

    实现bind方法的问题:

    1、返回一个函数
    2、可以传入参数
    3、返回参数
    4、构造函数效果
    5、调用判断

            Function.prototype.bind2 = function (context) {
                // 如果不是函数调用报错
                if (typeof this !== "function") {
                    throw new Error("Function.prototype.bind - what is trying to be bound is not callable");
                }
    
                var self = this;
                // 获取第一次bind时传参  bar.bind(foo,1)  获取参数 1
                var args = Array.prototype.slice.call(arguments, 1); 
    
                var fNOP = function () { }; // 中转函数
    
                var fBound = function () {
                    // 获取调用时函数的参数 bindFoo(2)  获取到2参数
                    var bindArgs = Array.prototype.slice.call(arguments); 
                    //---------------如果是new this失效 指向实例,如果不是new 则指向bind第一个参数
                    return self.apply(this instanceof fNOP ? this : context, args.concat(bindArgs)); // 调用函数,并返回值。
                }
    
                fNOP.prototype = this.prototype;
                fBound.prototype = new fNOP();
                return fBound; // 返回函数
            }
    

    详细文章推荐 JavaScript深入之bind的模拟实现

    相关文章

      网友评论

          本文标题:js的bind方法实现

          本文链接:https://www.haomeiwen.com/subject/zfevyktx.html