Question

美好的一天！

我几天前开始编写自己的基本JavaScript库供个人使用和分发，但我遇到其中一种方法有问题，特别是 bind（）。

在方法本身中， this 指的是库，即对象。

我去了Google并找到了 function.call（），但它没有按照我的计划方式运行 - 它只是执行了该功能。

如果您查看另一种方法 each（），您会看到它使用 call（）来传递值。

我也尝试了以下内容：

f.arguments[0]=this;

我的控制台抛出错误，说它无法读取“未定义”的“0”。

我希望能够传递 this （引用库 - 而不是WINDOW）在事件监听器中使用它。

您可以从this JSFiddle的JavaScript第195行开始看到它。

这也是：

bind:function(e,f){
    if(e.indexOf("on")==0){
        e=e.replace("on","");
    }
    if(typeof f==='function'){
            /*Right now, 'this' refers to the library
            How can I pass the library to the upcoming eventListener?
            */
            //f=f(this); doesn't work
            //f.call(this); //doesn't work

            //this.target refers to the HTMLElement Object itself, which we are adding the eventListener to
        //the outcome I'm looking for is something like this:
        /*$('h3').which(0).bind(function({
            this.css("color:red");
        });*/
        //(which() defines which H3 element we're dealing with
        //bind is to add an event listener
            this.target.addEventListener(e,f,false)
    }
    return this;
},

非常感谢你的帮助，贡献者！

Answer 1

因此，在这种特殊情况下，您实际上想要调用所有函数都有的JavaScript's built in bind method。

f = f.bind(this);

f将是一个新函数，它的this参数设置为传入它的任何内容。

Answer 2

根据您的评论，如果您不想使用.bind()，而不是直接将f传递给addEventListener()，则可以传递另一个函数，而该函数又调用{{1}与.call()或f：

.apply()

这样做也可以让您的库执行任何额外的事件管理，例如，对if(typeof f==='function'){ var _this = this; this.target.addEventListener(e,function(event){ f.call(_this, event); },false) }对象进行预处理，以规范化不同浏览器的不同属性。

Answer 3

将f=f(this);替换为f.apply(this);

查看下划线代码，此处： https://github.com/jashkenas/underscore/blob/master/underscore.js#L596

如何在JavaScript中将局部变量从函数传递给事件侦听器函数？

3 个答案: