양파맨의 겨울나기

2010. 10. 1. 17:30 Review/IT

jquery 플러그인 만들기 (2)

728x90

2010/08/31 - [Review/IT] - jquery 플러그인 만들기 (1)
jquery 플러그인 만들기 (1) 편에 이은 연재글입니다.

이전에 만들었던 플러그인에는 작은 단점이 있다. 바로 범용성이 떨어진다는 것인데, 플러그인은 어떤 환경에서 쓰일지 모르기 때문에 보편적으로 만들어야 한다.

간혹 jquery와 prototype.js 등의 프레임워크를 동시에 사용하는 환경이 있는데, 이런 경우 jquery의 $ 를 다른 표현으로 사용하기도 한다. 하지만 우리가 만들어놓은 플러그인은 $ 를 사용하기 때문에 충돌이 날 수 있다.

해결책으로 자신이 만든 플러그인 메소드를 래핑하는 방법이 있다.

우선 형식은 다음과 같다. (function() { statement })()

자신이 만든 메소드를 유효범위로 감싸면서 내부의 변수와 함수들을 private 하게 만드는 것이다.

(function() { statement })() 빨간색으로 되어 있는 부분을 하나의 함수명 이라고 생각하면 좀 더 쉽다.

function() 이 될텐데, 이는 마찬가지로 인자를 넘길 수 있다는 뜻이 된다.

(function() { statement }) == function

우리는 일전에 아래와 같은 플러그인을 만들었다.

$.fn.Alert = function() {
	return alert(this[0].id);
}

이걸 유효범위로 만들기 위해 아래와 같이 수정한다.

(function($) {
    $.fn.Alert = function() {
	return alert(this[0].id);
    }
})(jQuery);

이렇게 되면 $ (여기서는 jQuery) 변수를 익명함수의 인자값으로 넘기고, 익명함수는 jQuery 를 $로 받아서 플러그인에서는 계속 $를 사용할 수 있다.

Posted by onionmen

1 ··· 41 42 43 44 45 46 47 ··· 312