为什么在开发 jQuery 插件时使用 IIFE？

理解神秘的 jQuery IIFE 模式

简介

在深入研究 jQuery 插件开发时，经常会遇到一段神秘的代码片段：

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

这个神秘的表达式在 jQuery 插件领域具有重要意义。让我们揭开它的目的并探索插件构造的细微差别。

带有参数的函数的执行

代码块本质上执行一个接收 jQuery 的匿名函数对象作为参数。这种技术称为立即调用函数表达式 (IIFE)，有多种用途：

• 立即执行指定的代码而不污染全局范围。
• 允许封装本地变量和函数定义。
• 提供了一种干净的方式来向函数提供参数

插件编写风格比较

除了这个基本用途之外，还有几种编写 jQuery 插件的方法。让我们来看看三种常见样式之间的区别：

类型 1：扩展 jQuery 选择器

(function($) {
    $.fn.jPluginName = {

        },

        $.fn.jPluginName.defaults = {

        }
})(jQuery);

这种方法使用自定义方法扩展 jQuery 选择器，但它是从技术上讲不是一个插件。它为 jQuery 函数原型的现有方法添加了新功能。

类型 2：扩展 jQuery 核心

(function($) {
    $.jPluginName = {

        }
})(jQuery);

与类型 1 类似，这不会创建一个插件，但扩展了 jQuery 核心。它对于向 jQuery 库添加新的遍历方法非常有用。

类型 3：扩展 jQuery 函数的原型

(function($){

    //Attach this new method to jQuery
    $.fn.extend({ 

        var defaults = {  
        }  

        var options =  $.extend(defaults, options);  

        //This is where you write your plugin's name
        pluginname: function() {

            //Iterate over the current set of matched elements
            return this.each(function() {

                //code to be inserted here

            });
        }
    }); 
})(jQuery);

类型 3 是创建 jQuery 的首选方法插件。它允许创建可以在任何 jQuery 选择器上调用的自定义方法。通过扩展 jQuery 函数的原型，插件的功能可以通过所有选择器实例访问。

以上是为什么在开发 jQuery 插件时使用 IIFE？的详细内容。更多信息请关注PHP中文网其他相关文章！