$(function(){}とjQuery(function($){}の違い＆無名関数必要性の有無

[Ryuji Kanbe]

こんにちは。

opensocial-jqueryのサンプルではたいていの場合、
http://code.google.com/p/opensocial-jquery/wiki/GettingStarted_igoogle
にありますように、
多くの

jQuery(function($) {
// 実行したい処理
});

という書き方になっているのですが、

無名関数とjQuery - tmy-labo
http://tmy-labo.net/2009/03/jquery.html

jQueryと他のライブラリを同時に使用する方法 [ jQuery ] - StackTrace
http://stacktrace.jp/jquery/with_other_lib.html

あたりを見ると、特に他のライブラリとの同時使用をする際などは、

(function($) {

$(function() {
// 実行したい処理
});

// 各function

})(jQuery);

のように無名関数で覆ってやる必要があるということなのでしょうか？

自分ではちょっとわからないので、質問してみました。

--
神部

[なかじまん]

おはようございます。なかじまんです。

jQuery(function($) {
// 実行したい処理
});

と、

(function($) {
$(function() {
// 実行したい処理
});

})(jQuery);

の効果は同じです。

(function($) {
$(function() {
// 実行したい処理
});
// 各function
})(jQuery);

は、2つのことを同時に表現しているのでややこしいです。

(function() {
jQuery(function($) {

// 実行したい処理
});
// 各function

})();

という風に書き換えると、意図が把握しやすいと思います。

* jQuery 関数を使うことで、他のライブラリの $ 関数の曖昧さを解決できます。
* 無名関数でブロックを作ることで、jQuery 関数内のコードからのみのみ参照できる、
各 function を定義できます。

なお、OpenSocial jQuery wiki で jQuery(function($) { ... }); と記述してい
るのは、単なる個人的な指向(もっともタイプ数が少ない)ということですが、

$ を使わず jQuery からはじめるのは、このコード断片は jQuery のコードです
というのを暗に伝えるという意図もあります。

On Nov 22, 2:25 pm, Ryuji Kanbe <rka...@gmail.com> wrote:
> こんにちは。
>
> opensocial-jqueryのサンプルではたいていの場合、http://code.google.com/p/opensocial-jquery/wiki/GettingStarted_igoogle
> にありますように、
> 多くの
>
> jQuery(function($) {
> // 実行したい処理
>
> });
>
> という書き方になっているのですが、
>
> 無名関数とjQuery - tmy-labohttp://tmy-labo.net/2009/03/jquery.html
>

> jQueryと他のライブラリを同時に使用する方法 [ jQuery ] - StackTracehttp://stacktrace.jp/jquery/with_other_lib.html

[spicebox 神部]

なかじまさん

大変よくわかりました。

結果的になかじまんさんにjQueryのほうのご講釈をいただく
感じになってしまい申し訳ありませんでした。

ただ、これからopensocial-jqueryを使い始める、
jQueryに関する予備知識のないひとには、通常の
JavaScriptの書式に比べてちょっと唐突感が
あるかなと思い、さらにWikiではあまり他に
みない書き方（個人的にはこちらの方が好きですが）
だったのでこちらに伺ってしまいました。

OpenSocialアプリを書きたい人がこのブロックを
見たときになんなのかが理解しやすいような
説明を教えていただいた内容をもとに自分なりに
考えてみたいと思います。

本当にありがとうございました。

--
神部

--
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
Web のサービス続々リリース中！
http://labs.spicebox.jp/
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
スパイスボックスラボラトリ
神部竜二(mobile: 08059337029)
Ryuji Kanbe <ka...@spicebox.co.jp>

spicebox, inc. / 株式会社スパイスボックス
150-6016
渋谷区恵比寿4-20-3 YGPタワー16F
恵比寿ガーデンプレイス郵便局 私書箱5003
Tel 03-5449-7488 / Fax 03-5449-7487
http://www.spicebox.co.jp/
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=

[なかじまん]

こんばんは。なかじまんです。

> ただ、これからopensocial-jqueryを使い始める、
> jQueryに関する予備知識のないひとには、通常の
> JavaScriptの書式に比べてちょっと唐突感が
> あるかなと思い、さらにWikiではあまり他に

そうですね。自前でコンテンツを用意するのは大変なので、
何か jQuery の良質なチュートリアルを探して、掲載することを考えてみます。

[なかじまん]

こんばんは。なかじまんです。

Tutorials:How jQuery Works
http://docs.jquery.com/How_jQuery_Works

では $(document).ready(function() { ... }) で説明していますので、
OpenSocial jQuery でも、今後は同様にしていきます。

また、次のように、ショートカットされると、理解すればよいそうです。

(1) $(document).ready(function() { ... }) -- フルフル
(2) $().ready(function() { ... }) -- 省略時は document
(3) $(function() { ... }) -- さらに ready を省略

コールバックの $ は JavaScript としては、あってもなくても構いませ
ん。ただし、$ を使えば、このスレッドの冒頭にあるとおり、$ 関数の
曖昧さを解決できます。

さらに余談になりますが、日本で jQuery のコミュニティってないので
すかね。探してみたのですが、それらしきものは見当たりませんでした。
ので、jQuery に限ったネタでも、アプリ開発に役立つこと(そう)であれ
ば、ぜひ投稿ください。