ﾓﾊﾞｲﾙ版を表示しています｡PC版はこちら
jQueryの｢$.fn.Hoge また $.Hoge｣の文法の意味がよくわかりません｡
前者の$.fn.Hogeについてはﾌﾟﾗｸﾞｲﾝ(がどういうものが学習しきれていませんが)ということでいいと思うのですが､
http://phpjavascriptroom.com/?t=ajax&p=jquery_plugin
後者の$.Hogeについてはどういうことをしているものなのかが調べても分かりませんでした｡使い方としては以下のような記述になっていました｡
$.Hoge = function(a, b){}
jQueryは
$("ｾﾚｸﾀ").ﾒｿｯﾄﾞ
のように$にｾﾚｸﾀを与えるのが基本と思うのですが､$.**という書式は何を表すのか分かりません･･
ご教授頂けると嬉しいです｡
よろしくお願いいたします｡
●質問者:
koime_ryokutya
●ｶﾃｺﾞﾘ:ｳｪﾌﾞ制作
○ 状態 :終了
└ 回答数 : 3/3件
▽最新の回答へ
それらはjQueryの用法ですが､文法としてはjavascriptの基本的な文法にすぎません｡
javascriptにおいて"$"は変数名や関数名などに使える単なる識別子にすぎません｡
｢a=1｣｢b=2｣などと同じように｢$=3｣と出来るだけです｡
jQueryにおいて"$"は関数です｡
javascriptにおいて関数はｵﾌﾞｼﾞｪｸﾄでもあります｡すなわちﾌﾟﾛﾊﾟﾃｨやﾒｿｯﾄﾞなどのﾒﾝﾊﾞを持てます｡有名なところでｺﾝｽﾄﾗｸﾀの"prototype"がありますが､それ以外にも自由に持てます｡
jQueryの"$"はﾕｰﾃｨﾘﾃｨ的ないくつかのﾌﾟﾛﾊﾟﾃｨやﾒｿｯﾄﾞを持ちます｡
http://semooh.jp/jquery/api/utilities/
言ってみれば静的ﾒｿｯﾄﾞや静的変数のように使用されています｡ﾌﾟﾗｸﾞｲﾝがそれらを拡張することもあるでしょう｡
jQueryにおいて"$"を関数として呼び出す(｢$("ｾﾚｸﾀ")｣など)とjQueryのｵﾌﾞｼﾞｪｸﾄを返します｡
この時のjQueryｵﾌﾞｼﾞｪｸﾄのｺﾝｽﾄﾗｸﾀのprototypeﾌﾟﾛﾊﾟﾃｨは"$.fn"です｡
つまり､jQueryｵﾌﾞｼﾞｪｸﾄは"$.fn"を継承しています｡したがって"$.fn.Hoge"ﾒｿｯﾄﾞを作れば､jQueryｵﾌﾞｼﾞｪｸﾄに継承され､すべてのjQueryｵﾌﾞｼﾞｪｸﾄにHogeﾒｿｯﾄﾞができます｡
ﾌﾟﾗｸﾞｲﾝはこのようにして"$.fn"を拡張することでjQueryｵﾌﾞｼﾞｪｸﾄを拡張できます｡
a-kuma3さんのｺﾒﾝﾄ
$.Hoge は､namespace 的な使い方で､jQuery として特別な意味や機能は無い､ということ？
(便乗ﾓｰﾄﾞ)
TransFreeBSDさんのｺﾒﾝﾄ
javascriptはﾒﾝﾊﾞをprotectedに出来ませんので､基本的には特別な意味や機能はなかったと思います｡
ただ､一つだけ$のﾒｿｯﾄﾞとして呼ばれることにより､thisが$になる､ということがあります｡
＃しかし通常はｸﾛｰｼﾞｬを使うことが多いです｡
jQueryは$を通してｱｸｾｽするのが一般的ですが､jQueryという識別子のｵﾌﾞｼﾞｪｸﾄもあり､$===jQueryです｡そして､$.noConflict()というﾒｿｯﾄﾞがあり､このﾒｿｯﾄﾞを実行すると､$がjQueryﾛｰﾄﾞ前の状態に復元されます｡さらに$.noConflict(true)だと､$に加え識別子jQueryもﾛｰﾄﾞ以前に復元されます｡
http://semooh.jp/jquery/api/core/jQuery.noConflict/extreme/
ﾌﾟﾗｸﾞｲﾝﾛｰﾄﾞ時は別として､この状態を考慮する場合､jQueryへのｱｸｾｽに識別子や$を使うことが出来ません｡しかし､$のﾒｿｯﾄﾞであればthisが(今は別の識別子になってるかもしれない元)$になります｡
しかし､javascriptは呼び出され方によりthisが必ずしも(今は以下略)$にならないですし､ｸﾛｰｼﾞｬの方が確実で柔軟性が高く､$を使うのでthisよりわかりやすいです｡
そんなわけでjQueryに関連するというnamespace的意味しかないと言って良いはず｡
＃他に利点とか特別な事はなかったと思う
以下一般的な手法
>|javascript|
(function($){ // ｸﾛｰｼﾞｬ用も含め $===jQuery に
$.extend({ // 一つ一つ代入するのでなくextendﾒｿｯﾄﾞで拡張する
Hoge:function(){
// ここでも $===jQuery
}
});
$.fn.extend({ // jQueryｴﾚﾒﾝﾄの拡張の場合
hoge:function(){
// ここでも $===jQuery
}
});
})(jQuery); // ﾛｰﾄﾞ時は最低限jQueryで使用できる前提
||<
http://phpjavascriptroom.com/?t=ajax&p=jquery_plugin
koime_ryokutyaさんのｺﾒﾝﾄ
回答ありがとうございます｡
うｰん､ちょっと今の自分の知識では理解しきれないのですが､回答の中のｷｰﾜｰﾄﾞをいくつか拾いつつ調べてみます｡
ありがとうございます｡
koime_ryokutyaさんのｺﾒﾝﾄ
皆様､丁寧な回答ありがとうございました｡
自分で調べただけではなかなか理解が進まなかったとおもいます｡
まだきちんと理解はしきれていませんが､理解に必要な事柄は教えていただけたとおもいますので､さらに学習を進めます｡
▽2
●
a-kuma3
ごめんなさい､ぼくが余計なｺﾒﾝﾄを入れたものだから､混乱させてしまったのかも｡
$.fn.Hoge
質問に書かれているように､jQuery に対して､機能を追加したいときに使います｡
jQuery には､大きく分けて､幾つかの機能がありますが､大部分は､Selector を使って､ある要素の挙動を指定するものだと思います(ﾌﾟﾗｸﾞｲﾝを含めて)｡
$("なんとか").Hoge(...) というような形式で､自分が作った処理を jQuery っぽい形で追加したいなあ､というときの書き方です｡
$.Hoge
この形式で書かれているものを見たことが無いので､何とも言えないのですが､Hoge という関数が別に使われているかもしれない､でも､自分でその名前の関数を作りたい､というときに､使うかもしれない､という書き方なのかも｡
ただ､そのようなことを考慮するなら､｢別にもっと良い方法があるので､そっちの方が良いんじゃない？｣というのが､TransFreeBSD さんが回答のｺﾒﾝﾄで書いている
(function($){
...
})(jQuery);
という書き方です｡
$.Hoge = ... という書き方をしている例を提示してもらえれば､もうちょっと具体的なことが書けるのかもしれません(TransFreeBSD さんが？)｡
TransFreeBSDさんのｺﾒﾝﾄ
あｰ余計なこと書いたかもしれない｡
>>
Hoge という関数が別に使われているかもしれない､でも､自分でその名前の関数を作りたい､というときに､
<<
というのはまあそうで､もっと言えば別に使われているからというより､<strong>書いているのがjQueryのﾌﾟﾗｸﾞｲﾝだから､必要なのは全部$の中に入れて(もっと言えば$.Hoge.fooとか)､よそ(ｸﾞﾛｰﾊﾞﾙ)に変数や関数を作らないという､こだわりというか美的感覚による</strong>､というところかと｡
>>
そのようなことを考慮するなら?という書き方です｡
<<
それは｢別に使われているから｣｢よそ(ｸﾞﾛｰﾊﾞﾙ)に変数や関数を作らない｣でもありますが､ﾕｰｻﾞｰにも使ってほしいﾕｰﾃｨﾘﾃｨ関数は$の中に入れると思います｡
＃$.AllBigImg=function(){return $('img').うんた.らかんたら();}; // みたいな
これが$自体を拡張する意味のほぼすべてではないかと思います｡
で､蛇足として｢ほぼ｣に入らないであろう$の代わりにthisをつかう
＃$.AllBigImg=function(){return this('img').うんた.らかんたら();}; // みたいな
こういう方法をとるために$の中に関数入れるなんて発想もしいて言えばあるけど､普通はしないですよ､普通は｢?という書き方｣をしますということが言いたかったです｡
これも蛇足な気がしてましたが｡
koime_ryokutyaさん的には強調部分が回答のところになるかと｡
＃他の言語でもｸﾞﾛｰﾊﾞﾙじゃなく静的ﾒｿｯﾄﾞや静的変数にする意味の多くがこれかと｡
a-kuma3さんのｺﾒﾝﾄ
>>
ﾕｰｻﾞｰにも使ってほしいﾕｰﾃｨﾘﾃｨ関数は$の中に入れる
<<
確かに｡
koime_ryokutyaさんのｺﾒﾝﾄ
引き続き､回答ありがとうございます｡
調べたいｺｰﾄﾞとしてはjCal.jsというﾗｲﾌﾞﾗﾘのｺｰﾄﾞの中身になります｡
http://jquery-jcal.googlecode.com/svn/trunk/jCal.js
はじめの方に↓という記述があり､これの意味がわかりませんでした｡｡
$.fn.jCal = function (opt) {
$.jCal(this, opt);
return this;
};
$.jCal = function (target, opt) {
opt = $.extend({.....
簡単にいうと､$.Hogeというのはあらかじめ$.fn.Hogeという定義をしておいたので､jQueryのﾌﾟﾗｸﾞｲﾝとしてそれ以降は使えるようになったから､それを呼び出している､ということになるでしょうか？…
TransFreeBSDさんのｺﾒﾝﾄ
逆ですね｡
処理の実体は$.jCalにあって､ﾌﾟﾗｸﾞｲﾝ($.fn.jCal)はそれを呼び出しているだけ､という作りです｡
何でそうなってるのかな？と思ったのですが､$.jCalの方は$.jCal("#hoge")とか､普通のDOMｴﾚﾒﾝﾄ(getElementByIdとかで得られるやつ)とかも渡せるようになってるっぽい｡
＃jQueryの$()の機能なんですけどね
元々なんか作ったときのｻﾌﾞﾙｰﾁﾝだったのを､ちょっと修正してﾌﾟﾗｸﾞｲﾝ化したのかも｡
ｻﾌﾞﾙｰﾁﾝ的にもﾌﾟﾗｸﾞｲﾝ的にも､どっちでも使えるよ､っていう程度の事の気がします｡
a-kuma3さんのｺﾒﾝﾄ
>>
元々なんか作ったときのｻﾌﾞﾙｰﾁﾝだったのを､ちょっと修正してﾌﾟﾗｸﾞｲﾝ化したのかも｡
<<
同感｡
svn での 0.1 を見ても､その辺りの作りは一緒ですね｡
>|javascript|
(function($) {
$.fn.jCal = function (opt) {
$.jCal(this, opt);
return this;
};
$.jCal = function (target, opt) {
opt = $.extend({
...
||<
のくだりは､以下のように無名のまま呼び出すのと変わらないです｡
>|javascript|
(function($) {
$.fn.jCal = function (opt) {
(function(target, opt) {
opt = $.extend({
...
})(this, opt);
return this;
};
||<
[http://jquery-jcal.googlecode.com/svn/tags/0.1/jCal.js:title=0.1 のｿｰｽ]を見てもらうと分かるのですが､drawCal() の中で､click ｲﾍﾞﾝﾄの処理で､$.jCal() を呼び出しているので､ｸﾞﾛｰﾊﾞﾙなｽｺｰﾌﾟを持つ関数としておきたくて､でも､名前空間を汚したくないという意識が働いて､$ のﾒﾝﾊﾞにしたのかも｡
＃ その辺りも､ｸﾛｰｼﾞｬで解決できますが｡
で､最初の名残が､今も残っている､ということじゃないでしょうか｡
▽3
●
think49
jQuery.hoge は単純な静的関数でそれ以上の意味はありません｡
http://api.jquery.com/category/utilities/
jQuery では jQuery と $ は同じ意味を持ちます｡
関数名は小文字から始まる規則なので､この例で存在しうるｺｰﾄﾞは下記になると思います｡
jQuery.hoge = function (a, b) { ; };
$にｾﾚｸﾀを与えるのが基本と思うのですが､$.**という書式は何を表すのか分かりません･･
仰るように jQuery はｾﾚｸﾀを扱う関数が多くありますが､ｾﾚｸﾀを使わない機能を加えようとしたらどうなるでしょう｡
ｾﾚｸﾀを扱うとはつまり､DOMに対して関数を機能させる場合です｡
では､DOMに関係しない機能を加えるとしたら？
例えば､jQuery.inArray() は引数がArrayｵﾌﾞｼﾞｪｸﾄか否かを判定しますが､そこにDOMは関与していません｡
ですので､jQuery.inArray のように定義されています｡
http://api.jquery.com/jQuery.inArray/
jQuery.inArray('hoge'); // false
●質問をもっと探す●
0.人力検索はてなﾄｯﾌﾟ
8.このﾍﾟｰｼﾞを友達に紹介
9.このﾍﾟｰｼﾞの先頭へ
□対応機種一覧
□お問い合わせ
□ﾍﾙﾌﾟ/お知らせ
□ﾛｸﾞｲﾝ
□無料ﾕｰｻﾞｰ登録
□はてなﾄｯﾌﾟ
ﾍﾞｽﾄｱﾝｻｰ