>웹 프론트엔드 >JS 튜토리얼 >jQuery 플러그인을 개발할 때 IIFE를 사용하는 이유는 무엇입니까?

jQuery 플러그인을 개발할 때 IIFE를 사용하는 이유는 무엇입니까?

Patricia Arquette
Patricia Arquette원래의
2024-11-08 03:14:02758검색

Why Use an IIFE When Developing jQuery Plugins?

수수께끼의 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 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.