为什么在javascript函数上使用jQuery插件?

时间:2014-12-09 18:32:03

标签: javascript jquery function

为什么你会使用jQuery插件而不是传统的javascript函数?我看到的唯一区别是你需要将一个jQuery对象传递给js函数......除此之外,我没有看到很大的区别,因为它似乎可以用类似的步骤完成同样的事情:

        $(document).ready(function () {
            $('p').jQuery_greenify();
            greenify($('p'));
        });

        $.fn.jQuery_greenify = function () { 
            this.css("color", "green");
        };

        function greenify (el) {
            el.css("color", "green");
        }

我还发现使用javascript函数可以更轻松地命名空间:

        var mynamespace = {

            greenify : function (el) {
                el.css("color", "green");
            }
        }
        mynamespace.greenify($('p'));

3 个答案:

答案 0 :(得分:3)

通常,JQuery函数的用处在于链接它们。就像你想打电话一样:

string.substring(2, 5).startsWith("lol")

而不是

Util.StartsWith(Util.substring(string, 2, 5), "lol")

这种方式更容易阅读。事实上,我认为第二个功能可能仍然需要"返回这个"有用吗?

它可能取决于上下文 - 某些操作非常依赖于元素或元素集,而其他操作只是更自觉地站在自己身上 - 因此,您的命名空间方法就可以了。它是部分编码风格。

免责声明 - 我没有编写JQuery插件的经验,这只是我基于JS语言设计的一般观察。

答案 1 :(得分:2)

始终是jQuery对象

正如你所说的那样使用插件(它实际上是一个对象原型)你确定this将是一个jQuery对象,因为没有jQuery对象就无法调用它 ,如果您使用.call.apply.bind等等。

同时,您可以将任何内容传递给函数,因此参数可能不是jQuery对象并且会抛出错误。

链接时的可读性

你可以使用这两种方法链接函数,但说实话,使用jQuery原型,它更漂亮:

$.fn.jQuery_greenify = function () { 
    return this.css("color", "green");
};

$('div').jQuery_greenify().append(...);

//VS

function greenify (el) {
    return el.css("color", "green");
}

greenify($('div')).append(...);

范围

在原型中添加功能时,无论您在哪个范围内,都可以随处访问。这允许你创建一个特定的闭包:

(function(){
    $.fn.jQuery_greenify = function () { 
        return this.css("color", "green");
    };
})();

$('div').jQuery_greenify(); //Work

//VS

(function(){
    function greenify (el) {
        return el.css("color", "green");
    }
})();

greenify($('div')); //Undefined is not a function error

答案 2 :(得分:1)

jQuery的最初用处是为诸如DOM操作和AJAX之类的东西提供一致的API - [较旧的]浏览器以非常不同的方式实现的东西。需要20多行代码才能完成使用jQuery的1-2行代码。它抽象出了所有的不一致性,因此您可以专注于编码。

然后,John Resig发生了最糟糕的噩梦,人们现在认为jQuery是一种语言,几乎是独立于Javascript的。 </rant>

今天,大多数浏览器都采用了标准,你不必担心关于不一致的问题,除非你试图支持&lt; IE9。你可以使用像下划线这样的东西来帮助利用更新的javascript功能(对于即使在今天的浏览器中仍然不一致地实现的东西具有向后兼容性)。

关于插件,优点是具有实现可重用代码的一致方法。例如,我有点不同意你是如何创建命名空间的(不是真的,但我会以不同的方式完成它)。

重点是,它是所有的javascript。学习javascript。如果不使用图书馆就可以更轻松,更快捷地完成任务做到这一点!注意社区,尝试使用其他人采用的技术......即使偶尔也意味着使用图书馆。

注意:如果有人将jQuery置于&#34;语言&#34;在他们的简历中,把它扔进垃圾桶。