【JavaScript】function定義方法による動作の差異(覚書)
例えば、
- function TEST() {alert('TEST')}
- var TEST=function() {alert('TEST')};
- var TEST=function test() {alert('TEST')};
- var TEST=new Function("alert('TEST')");
これらは普段、特に意識して区別することなく使用しているのですが、調べてみると定義の仕方で微妙に動作が異なってくるようです(あ、new Function()は私には使いにくくてほとんど使っていないので検証はパス(苦笑))。
例えば→こんな感じ。
3.(右辺が名前付き関数)の書き方をしたあとで、右辺の関数名(例では'test')をtypeofしてみると、IE6ではfunction、Firefox/Operaではundefinedになる(IE6ではtest()で呼びだし可能、Firefox/Operaでは例外発生)。ってことでしょうかね。
また、
IE6では、3.(右辺が名前付き関数)の前に 1.(通常の名前付き関数)の形式で 3. の右辺と同名の関数(例では'test')が定義されていると、3. によって上書きされてしまう。という現象が発生してしまいます(サンプルの[CASE-2])。 2.のように右辺が無名関数になっていればそんな現象は起らないのですが、うっかり 3. のように右辺に関数名をつけて書いてしまうと、なかなか見つけにくいバグが発生しそうです。
({test:(function test() {p("TEST");})})のように設定されます。
これから、まず新規に(無名の)Objectを作成し、そのプロパティ(上記例では'test')の値として右辺の関数を設定した後、当該プロパティ(への参照)を左辺に渡す、ということをやっているのではないかと推測されます。
実際、
var TEST=(function(){return {test:(function test() {p('TEST');})}.test;})();のようにしてやっても、Firefoxでは 3. の場合と同様の動きになります。
あるいはもっとシンプルに
var TEST={test:function test() {p('TEST');}}.test;
多分、Operaでも似たようなことをしているのかとは思いますが、Operaは__parent__が無いため検証は出来ませんでした。
右辺で名前付き関数を指定した場合、その都度専用の名前空間用オブジェクトが作成されてしまうことになるので(共用はされず、また同名にしても上書きにはならない模様)よほどの理由がない限り、無名関数とした方がよさそうです。
2007/12/18(火) 04:14 | 固定リンク
| 記事の編集(管理者用)
「パソコン・インターネット」カテゴリの記事
- ツールを作る側は対象に与える影響をどこまで気にするか?(2008.05.29)
- "『無断リンクはやめて』という人にはしない方向で"の思考過程(2008.05.24)
- 『無断リンクはやめて』という人にはしない方向で(2008.05.22)
- ちょっと小細工:textareaの高さを自動調節(2008.05.21)
- Yin and Yang:動作改善(?)他(2008.05.14)
「覚書」カテゴリの記事
- ちょっと小細工:textareaの高さを自動調節(2008.05.21)
- Google検索結果画面のHTML構造、変わりました?(2008.04.30)
- Googleの検索結果からH2タグが消える現象の原因(2008.05.03)
- 【JScript】ActiveXObject('htmlfile')で発生する不具合(2008.04.05)
- 【JavaScript】onmouseover/onmouseoutの振る舞い(2008.03.11)

