주제: 다음 함수의 차이는 무엇일까요

1.
jQuery(function ($) {

});

2.
(function($) {

})(jQuery);

둘 다 $(document).ready(function() {}); 함수 안에 넣지 않아도 스크립트 파일이 호출되면 실행되는데, 두번째 함수가 첫번째 함수보다 먼저 실행됩니다. 근데 무슨 함수이고 어떤 차이가 있는건지 감이 안 잡힙니다;;

radio heaven

답변: 다음 함수의 차이는 무엇일까요

cain wrote:
1.
jQuery(function ($) {

});

2.
(function($) {

})(jQuery);

둘 다 $(document).ready(function() {}); 함수 안에 넣지 않아도 스크립트 파일이 호출되면 실행되는데, 두번째 함수가 첫번째 함수보다 먼저 실행됩니다. 근데 무슨 함수이고 어떤 차이가 있는건지 감이 안 잡힙니다;;

1번은 document ready와 똑같은 거구요 'ㅅ'
2번은 즉시실행함수인데 jQuery를 $로 던져줍니다

(...)

무책임한 답변이네요 -_-;;;;

1번은 $(document).ready(function() {}); 와 똑같은 일을 하는 녀석입니다.
html문서 파싱이 끝나면 안에 있는 명령들을 실행해주고요,
(아, 그리고 사실 1번 ()안의 $는 없어도 되는 녀석인데... 왜 있는지는 모르겠네요 ㅇ.ㅇ)

2번은
(function() {})(); 이 녀석하고 똑같은데,
jQuery라는 변수를 $로 받도록 해주는거죠.
2번 안쪽에 있는 $들은 밖에서 jQuery로 받아들여요.

아, 설명을 제대로 잘 못하겠는 걸 보니 아직 멀었나봅니다 -_-;;;

밑의 녀석은 위에서 말씀드린 것처럼 즉시실행함수라 나오자마자 실행되니까 1번보다 먼저 실행되는거죠.
즉시실행함수에 대해서는 단어의미 자체로, 혹은 검색해보시면 금방 이해하실 것 같아요.

2번은
1) jQuery를 다른 라이브러리와 같이 사용할 때 $사용이 충돌하지 않도록 쓰거나,
2) 다른 곳에서 사용한 변수명이 충돌해주지 않게 해줍니다.
(조금 더 파보면 1), 2)가 같은 말이긴 해요;;;)

말만 길어졌지 답변이 별로군요 -_-;;;
다른 분이 알기쉽고 훌륭한 답변을 해주실거라 믿으며 도망갑니다.

3 최종 편집 : miname (2012-10-04 07:52 PM)

답변: 다음 함수의 차이는 무엇일까요

1번의 경우, callback 함수에 $를 던져준 이유는 보통 다른 JavaScript 라이브러리에서 사용하는 $ 이름의 namespace 충돌을 피하려고 할 때 $.noConflict()을 실행하는데, 이때 .ready() callback 함수는 자동으로 jQuery object를 받게 됩니다. 요놈을 $ 이름으로 지정하면 callback 함수에서도 안전하게 jQuery object 대신 간단하게 $를 쓸 수가 있게 되지요.

2번은 Immediately-Invoked Function Expression (IIFE)의 한 형태로 단지 함수 안에서 jQuery object에 접근할 떄 $ 이름을 쓸 수 있게 jQuery 대신 더 간단한 $ 이름을 지정해 준 모양입니다.

1번과 2번은 그 쓰임새가 서로 다르지만, jQuery 라이브러리를 사용할 때 global에 선언된 jQuery object를 함수 안에선 짧은 $ 이름으로 대체해서 사용할 수 있도록 일종의 alias를 지정해 준 형태에는 공통점이 있습니다.

+ = ²

답변: 다음 함수의 차이는 무엇일까요

두분 설명 고맙습니다^^ 덕분에 읽고 잊어버리고 있었던 함수 선언/표현 부분도 다시 찾아봤어요.

이 함수들을 본 파일이 http://www.editsquarterly.com/ 사이트의 edits.iancoyle.js?0.0.0.9 파일인데요. UI부분이 멋져서 저도 따라서 작업을 해 봤는데 http://hyengin.cafe24.com/edit/ 이렇게 id를 직접 지정해서 작업하는 방법밖에 안 떠오르네요. 공부하다 보면 이 단계 졸업할 수 있겠죠?ㅠㅜ

radio heaven