理解 javascript 中的方法链答案

【问题标题】：Understanding method chaining in javascript理解 javascript 中的方法链
【发布时间】：2014-02-02 17:07:27
【问题描述】：

我希望方法链能够工作，但似乎我没有得到一些概念。

这个：

$(".list").activeJS()

首先必须使用 jQuery 来获取 HTMLElement 节点列表，然后它必须调用传递节点列表的 activeJS() 函数。

var activeJS = function(item){

    alert(item) //nodelist


}

现在我得到一个 TypeError: $(...).activeJS is not a function error in my console.

谢谢，

【问题讨论】：

You should do some studying.

标签： javascript jquery function chaining

【解决方案1】：

如果你想创建一个可从 jQuery 对象调用的函数，你必须将它添加到 jQuery 原型对象中：

jQuery.fn.activeJS = function(item) {
  // ... whatever
};

【讨论】：

如何将其设置为对我的函数的引用并仍然返回 jquery 节点列表，以便我可以提醒节点列表，如上面的示例所示？
@kevinius jQuery 插件函数遵循一定的约定。当被调用时，this 被绑定到 jQuery 对象，如果 jQuery 对象被设计成链式使用，插件函数负责返回它。我在您的问题下方的评论中链接的页面详细介绍了。
嗨，谢谢，我已经阅读了教程，但我的一些问题没有得到解答。就像，我如何引用一个函数而不是直接将一个函数分配给原型，同时仍然传入 jQuery 对象 - jQuery.fn.activeJS = function(item){ activeJS(item)}
您总是可以单独编写函数，然后在原型上引用它，就像使用任何函数一样。换句话说，如果你定义了函数“myFunc”，那么你可以用jQuery.fn.myFunc = myFunc;把它变成一个jQuery插件
如果我想将参数传递给 myFunc，我该怎么做？谢谢

【解决方案2】：

当一个函数被添加到 jQuery（允许链接）时，它被称为一个插件，并且必须考虑一些事情。例如，您的函数本身是否可链接？您的函数会在单个元素还是多个元素上工作？我建议您研究 jQuery 插件并将您的函数构建为 jQuery 中的插件。

这里有一个excellent tutorial 介绍如何构建一个 jQuery 插件，其中涵盖了链接、传递属性和调用不同插件函数等概念。查看文章并确定您的函数是否真的需要成为插件。

最好将jQuery 和所选元素作为参数传递给您的函数，而不是链接。

【讨论】：

我认为让人们使用 jquery 方法链接模式初始化我的脚本更加用户友好。这就是为什么我不只是将 jQuery 传递给我的插件。
@kevinius 这没有问题，但是当您做出决定时，还有其他事项需要考虑。

【解决方案3】：

看看这个例子：

var obj = {
    fn: function(){
        console.log("fn method");
        return this;
    },
    abc: function(){
        console.log("abc method");
        return this;
    },
    oneMore: function(){
        console.log("one more method");
        return this;
    }
};

这里的链接是通过返回对 obj 对象的引用来提供的。简单地说，每次调用该对象的方法时，都会返回该对象——并且可以继续调用它的方法。这是您也可以在 jQuery 中找到的基本链接模式 - 稍作修改，但想法相同。由于 javascript 的动态特性，我们可以做这种事情。链接允许耦合由公共对象连接的相关方法。这种模式起源于函数式编程，而 javascript 深受函数式语言（主要是方案）的影响。但是太多的链接会导致代码不可读，这可以在很多 jQuery 示例中看到。

【讨论】：