什么（function（$）{}）（jQuery）;意思？

6 回答

• 116

  首先，看起来像 (function(){})() 的代码块仅仅是在适当位置执行的函数 . 让我们分解一下吧 .

  1. (
  2.    function(){}
  3. )
  4. ()
  

  第2行是一个普通函数，用括号括起来告诉运行时将函数返回到父作用域，一旦它返回，则使用第4行执行该函数，也许通过这些步骤阅读将有助于

  1. function(){ .. }
  2. (1)
  3. 2()
  

  你可以看到1是声明，2是返回函数，3只是执行函数 .

  如何使用它的一个例子 .

  (function(doc){
  
     doc.location = '/';
  
  })(document);//This is passed into the function above
  

  至于插件的其他问题：

  类型1：这实际上不是一个插件，它是一个作为函数传递的对象，因为插件往往是函数 .

  类型2：这也不是一个插件，因为它没有扩展 $.fn 对象 . 它只是jQuery核心的扩展，虽然结果是一样的 . 这是您要添加遍历函数，如toArray等 .

  类型3：这是添加插件的最佳方法，jQuery的扩展原型采用一个包含插件名称和功能的对象，并将其添加到插件库中 .

  回复于 2024-05-13T08:15:17+08:00
• 24

  在最基本的层面上， (function(){...})() 形式的东西是一个立即执行的函数文字 . 这意味着您已经定义了一个函数，并且您正在立即调用它 .

  此表单对于信息隐藏和封装非常有用，因为您在该函数内定义的任何内容都保留在该函数的本地，并且无法从外部世界访问（除非您专门公开它 - 通常通过返回的对象文字） .

  这个基本形式的变体就是你在jQuery插件中看到的（或者在这个模块模式中） . 因此：

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

  这意味着您传递了对实际 jQuery 对象的引用，但它在函数文字范围内称为 $ .

  类型1 isn 't really a plugin. You'只需将对象文字指定给 jQuery.fn . 通常，您将函数分配给 jQuery.fn ，因为插件通常只是函数 .

  类型2类似于类型1;你不是简单地将对象文字添加到 jQuery.fn .

  类型3是一个插件，但它不是创建一个插件的最佳或最简单的方法 .

  要了解更多相关信息，请查看类似的question和answer . 此外，this page详细介绍了创作插件 .

  回复于 2024-05-13T08:15:17+08:00
• 5

  一点帮助：

  // an anonymous function
    
  (function () { console.log('allo') });
  
  // a self invoked anonymous function
  
  (function () { console.log('allo') })();
    
  // a self invoked anonymous function with a parameter called "$"
    
  var jQuery = 'I\'m not jQuery.';
  
  (function ($) { console.log($) })(jQuery);
  

  回复于 2024-05-13T08:15:17+08:00
• 11

  类型3，为了工作必须看起来像这样：

  (function($){
      //Attach this new method to jQuery
      $.fn.extend({     
          //This is where you write your plugin's name
          'pluginname': function(_options) {
              // Put defaults inline, no need for another variable...
              var options =  $.extend({
                  'defaults': "go here..."
              }, _options);
  
              //Iterate over the current set of matched elements
              return this.each(function() {
  
                  //code to be inserted here
  
              });
          }
      }); 
  })(jQuery);
  

  我不确定为什么有人会使用扩展直接在jQuery原型中直接设置属性，它只在更多的操作和更混乱中做同样的事情 .

  回复于 2024-05-13T08:15:17+08:00
• 11

  只是小解释

  这个结构 (function() {})(); 被称为IIFE（立即调用函数表达式），它将在解释器到达此行时立即执行 . 所以当你写这些行时：

  (function($) {
    // do something
  })(jQuery);
  

  这意味着，解释器将立即调用此函数，并将 jQuery 作为参数传递，该函数将在函数内部用作 $ .

  回复于 2024-05-13T08:15:17+08:00
• 206

  实际上，这个例子帮助我理解 (function($) {})(jQuery); 的含义是什么？

  考虑一下：

  // Clousure declaration (aka anonymous function)
  var $f = function (x) { return x*x; };
  // And use of it
  console.log($f(2)); // Gives: 4
  
  // An inline version (immediately invoked)
  console.log((function (x) { return x*x; })(2)); // Gives: 4
  

  现在：

  jQuery 是一个包含jQuery对象的变量 .
  $ 是像任何其他变量名（ a ， $b ， a$b 等，它并没有像在PHP中的任何特殊含义） .

  var $f = function ($) { return $*$; };
  var jQuery = 2;
  console.log($f(jQuery)); // Gives: 4
  
  // An inline version
  console.log((function ($) { return $*$; })(jQuery)); // Gives: 4
  

  回复于 2024-05-13T08:15:17+08:00