為什麼在開發 jQuery 外掛時使用 IIFE？

理解神秘的jQuery IIFE 模式

簡介

在深入研究jQuery 外掛程式開發時，常會遇到一段神秘的程式碼snippet:

(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中文網其他相關文章！