什么时候我应该写我的代码作为jQuery插件

When should I write my code as a jQuery plugin

本文关键字：jQuery 插件 代码 我应该 我的 什么时候      更新时间：2023-09-26

假设没有其他类似的框架，并且忽略jQuery依赖的潜在陷阱和潜在的性能开销。

我想知道当一个内聚的JavaScript函数组应该编码为jQuery插件。当然，这涉及到很多主观性和上下文——也许应该描述一下沿着jQuery之路走下去的最重要情况的目录。

我的主要查询领域是:

  • 与简单JavaScript对象相比，jQuery插件结构的优点
  • 是插件最有利于"链接"和操作的DOM级别。也就是说，jQuery插件应该专注于DOM操作吗?
    • 也许所有的JavaScript编码场景都受益于结构化的代码?正确封装'this'

我对JavaScript代码的愿望是:-标准-易于阅读/修改-更可预测-最小的bug(让我们忽略ide和CoffeeScript和其他技术，但要考虑减少人为错误的好处)

希望这个问题的描述足够清晰和狭窄，可以为所有JavaScript编码人员在这个非常具体的设计问题上获得一些有用的答案。

什么是JQuery插件:

一个JQuery插件是JavaScript等效的扩展方法。让我们看一下插件语法:

$.fn.stretch = function(multiple) {
    this.each(function() {
        var $t = $(this);
        $t.height($t.height * multiple);
        $t.width($t.width * multiple);
    });
    return this;
};

我已经创建了一个插件，它将通过多个参数选择的元素的高度和宽度相乘。(注意，这是为了演示而拼凑在一起的)。

$('#smallDiv').stretch(2);

该方法操作$(this)，即它所附加的对象，并返回一个对象，允许进一步

这是一个很好的指南JQuery插件设计模式的范围——一些意味着优化性能，其他的互操作性/链接，可变性等。

JQuery插件的好处:

1)链接

$('#smallDiv').css("background-color", "beige").stretch(2);

2)可重用性

我承认这是一个勉强的例子，但是……

$('#smallDiv').stretch(2).stretch(1.5);

3)作用域的模块化

插件中的代码无需担心变量作用域。它是完全自包含的，只使用局部变量。

4) Readbility

我假设您的插件被恰当地命名为

To DOM或not To DOM:

插件在很多方面都很有用

我怀疑90%的插件是用于DOM操作的。链是一个很大的优势。

但是JQuery已经有很多数组扩展方法:

$.distinct([1, 2, 2, 3])
$.union([1, 2, 2, 3], [2, 3, 4, 5, 5])
$.intersect([1, 2, 2, 3], [2, 3, 4, 5, 5])
$.except([1, 2, 2, 3], [2, 3, 4, 5, 5])

(全部从Kristian Abrahamsen GitHub Repo借来)

和插件字符串，cookie等存在，可以/应该考虑

JQuery插件的缺点:

全局并不总是高贵的:你漂亮的新stretch()插件可以在任何地方使用。这是好事还是坏事?你决定。谁应该使用它?谁不能?应该在哪些元素上使用它?

如果您不想重复使用，就不要创建插件。我敢肯定，你们团队中的许多开发人员都太有创意了。

规划是必须的!参考这个Brolick博客开发插件指南

在Brolick指南和模式参考之间，你会注意到有许多错误和问题是你粗心的插件开发造成的。其中最常见的是性能差和内存泄漏。两者都被低估了潜在的严重性，并且在插件开发中猖獗和频繁。

相关文章：