11

我了解如何定义这样的函数：

function myfunc(x,y,z) {
   alert("Just an example " + x + y + z)
}

但不是这个：

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

    <script>
        (function ($) {
        $.fn.idle = function (x, y, z) {
            alert("Just an example " + x + y + z)
    }(jQuery));
    </script>

以上是我正在使用的库的一部分，但我根本无法理解$.fn.idle。

它在做什么？它以某种方式定义了一个名为“idle”的函数，但是$.fn呢？那(function ($) {部分呢？同样，我理解$(document).ready(function() {但(function ($) {完全陌生。是短手吗？

(jQuery));底部的意义是什么？

4

4 回答 4

8

一个立即调用的函数表达式，它在其范围内具有jQuery别名：$

(function($) {}(jQuery));

它立即创建并执行一个函数。这样$，无论全局$引用什么，您都可以在函数内部使用来引用 jQuery。对于使用jQuery.noConflict(). 此外，在 IIFE 中声明的变量也不会泄漏到全局范围。

至于问题的另一部分，$.fn === jQuery.prototype。因此，通过向 jQuery 原型添加方法，您可以在任何 jQuery 对象上调用它。例如：

$.fn.doSomething = function(){}; //add a method to the jQuery prototype
$('selector').doSomething(); //then you may call it on any jQuery object

更多关于jQuery 插件创作。

于 2013-07-30T15:16:17.700 回答
1

这被称为 IIFE - 立即调用函数表达式。

(function ($) {
    // inside stuff
}(jQuery));

jQuery被导入到函数体中$，函数立即运行。

// inside stuff

$.fn.idle = function (x, y, z) {
    alert("Just an example " + x + y + z)
} // added in missing parentheses

$.fn等价于jQuery.fn并且jQuery.fn.idle只是jQuery.fn指向函数的属性。

另一个有趣的点是，它jQuery.fn是 的别名jQuery.prototype，即它们是同一个东西。

这里的很多别名使代码比实际复杂一些。

这是您将看到的用于将插件/mixin 添加到库的常见结构。

希望，我为你剪好了。

于 2013-07-30T15:17:09.413 回答
1

添加函数以$.fn使它们可用于 jQuery 对象。

$.fn.alertTitle = function() { alert( $(this).attr('title') ); };
$('#foo').alertTitle();
于 2013-07-30T15:17:26.843 回答
1

这是将函数分配给变量：

var test = function () { alert('testing'); }
test(); // will alert testing

分配给变量的函数也称为“匿名函数”，因为它没有名称，通常用于将函数作为参数传递给另一个函数。

在 javascript 中，变量可能以 开头，$jQuery 使用它。jQuery 是一个对象，它具有属性，其中一个称为fn. 这个属性也可以有属性，在这种情况下idle。

所以$.fn.idle = function () {};归结为：

$ = {
    fn: {
        idle: function () {}
    }
};

这也被称为“命名空间”，尽管它也可能有其他细微差别。另请注意，您只能将属性分配给现有对象：

var myVar = {};
myVar.test.foo = {}; // results in error because myVar.test is undefined
myVar.test = {
    foo: {}
}; // this is correct
于 2013-07-30T15:17:48.217 回答