無名関数って何?コードを覗いてみたけど、意味が分からない

このQ&Aのポイント
  • 無名関数とは、名前のない関数のことです。jQuery.fileupload.jsのソースコードを見ていたところ、無名関数が使われていましたが、その書き方について分からず困っています。
  • 無名関数は、関数の定義と同時にその関数を呼び出すことができる特徴があります。無名関数の書き方には、一つ目の方法として(function () { /* 関数の中身 */ })()という形式があります。
  • 質問のコードの修正でエラーが発生しているのは、無名関数の呼び出しを行う()が最後にないためです。正しい書き方は、(function () { /* 関数の中身 */ })()です。無名関数は、特定の処理をまとめて実行したい場合などに使用することができます。
回答を見る
  • ベストアンサー

無名関数?

こんにちは jQuery.fileupload.jsのソースコードを覗いていたのですが いきなり下記のような書き方でコードが表示されていたのですが 意味が分からず悩んでいます。 ======================= (function (factory) { 'use strict'; :     : } (function ($, tmpl, loadImage) {     :     : })); ======================= 最初は無名関数が複数並んでいるのかと思い下記のように修正してみましたが エラーが発生してしまいました。 ======================= (function (factory) { 'use strict'; :     : }); (function ($, tmpl, loadImage) {     :     : }); ======================= 調べてみても上記の書き方をしているサイトが見つからず悩んでます。 ご存知の方がいたら無知な自分に教えて頂けますでしょうか。 よろしくお願いいたします。

  • DHIN
  • お礼率73% (25/34)

質問者が選んだベストアンサー

  • ベストアンサー
  • Ogre7077
  • ベストアンサー率65% (170/258)
回答No.2

難解なプログラムは、一部分を変数化することによって理解しやすくなります。 (function (factory) {'use strict'; ...} (function ($, tmpl, loadImage) {...})); 即時関数を変数化して var objA = function ($, tmpl, loadImage) {...}; (function (factory) {'use strict'; ...} (objA)); さらに変数化して var objA = function ($, tmpl, loadImage) {...}; var objB = function (factory) {'use strict'; ...}; (objB (objA)); あまり意味のない括弧を外して var objA = function ($, tmpl, loadImage) {...}; var objB = function (factory) {'use strict'; ...}; objB(objA); というわけで、 「関数オブジェクト(objB)を実行する。引数は関数オブジェクト(objA)」 という処理のようです。

DHIN
質問者

お礼

返事が遅れてすみません。 回答して頂きありがとうございます。 即時関数と教えて頂いていたのですが、呼び出す順番が分かりませんでしたが Ogre7077さんが細かく説明して頂いたことではっきりわかりました! 大変ありがとうございました。

その他の回答 (1)

  • ok-kaneto
  • ベストアンサー率39% (1798/4531)
回答No.1

http://blog.tojiru.net/article/197270788.html 即時関数ですかね。上記をご参照ください。

DHIN
質問者

お礼

即時関数というのがあるのですね。 初めて知りました。 ありがとうございます!!

関連するQ&A

  • function()は無名関数?

    jqueryの$(function() は無名関数だと思いますが、redyが省略されているので、DOMを読み込み終わってから実行とも聞きます。 両方の意味があるのでしょうか? 一見ダダの無名関数に見えますがどのように区別するのでしょうか? 下記の部分もfunction()があるのですがこちらもまた無名関数のなのですか? ただ即時関数ではないので変数などに入れて、関数の呼び出しをしないといけないのにその記載がなくても実行されるのはなぜでしょうか? each(function() $(function() { $(".textbox").each(function(){ var labelText = $(this).val(); $(this).focus(function(){ if( $(this).val() == labelText ){ $(this).val(""); } }).blur(function(){ if( $(this).val() =="" ){ $(this).val(labelText); } }); }); }); 補足 $(".textbox").each(function(){ var labelText = $(this).val(); $(this).focus(function(){ if( $(this).val() == labelText ){ $(this).val(""); の部分は無名関数の中身、つまりこの関数が実行されるときの中身のことなのでしょうか? jqueryだと何となくこの書き方をしているのですがJSの基礎で考えるとそのようになりますよね?

  • 無名関数の継承の方法

    あるフレームワークを使用して カスタムした処理を書きたいと思っています。   カスタム処理を書くために、子供オブジェクトから tool関数を参照したいと考えているのですができないようです。   下記の状態で子供オブジェクトから tool関数を参照するにはどのようにすればいいでしょうか。   library.jsはフレームワークのコードなので変更できません。 custom.jsは自由に変更できます。   library.js   (function () {       function tool(num){       //処理     }       window.Parent = function(){     };          Parent.prototype.target = function(){       foo(0);     };   })();   library.js ここまで   custom.js ここから。   function Child(){ };   Child.prototype = new Parent();   Child.prototype.target = function(){ //tool(1); ここでtoolを参照したいが、できない。 };   custom.js ここまで

  • 複数の無名関数を合成したい

    javascriptにおいて、無名関数を合成する方法を知っている方はいらっしゃるでしょうか? var func1 = function(){     alert('func1'); } var func2 = function(){     alert('func2'); } この二つの関数を合成して、 var func3 = function(){     alert('func1');     alert('func2'); } という風に合成したいのです。 jQueryを利用して var func3 = $.extend(func1, $func2); と試しましたが、func3 == func1 となってしまうようです。 また、単純に、var func3 = func1 + func2; では、 func3 = function(){alert('func1');}function(){alert('func2');} と意味を成さないものになってしまいます。

  • [jQuery] クリックで連番関数を順番に実行

    ボタンをクリックする度に連番で作成した関数を順番に実行したいのですが、スマートな書き方がわかりません。 下記のコードで一応動くのですが、関数が100個とかに増えた場合すごくコードが長くなってしまいます。 もっとスマートに書く方法はないものでしょうか? ▼サンプルコード <html> <head> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script> $(function(){ function s1(){alert('s1');}; function s2(){alert('s2');}; function s3(){alert('s3');}; var num = 1; $('p').click(function() { if(num == 1){s1();} else if(num == 2){s2();} else if(num == 3){s3();} num++; return false; }); }); </script> </head> <body> <p>click</p> </body> </html>

  • 関数を呼んだら、その中の関数も自動実行される?

    ・関数の実行タイミングが分からないので教えてください ・下記で、どうして引数が渡るのでしょうか? ・portal関数を呼んだら、gooプロパティに無名関数が格納される(?)と思うのですが、=関数実行になるのでしょうか? ・無名関数だから? var obj = {  portal : function( arg ) {   var goo = function(arg){    console.log(arg);   }(arg);  } } obj.portal("あ"); ・自分的には、portal関数を呼んで変数gooに無名関数を格納(?)した後、明示的にgoo();と呼ぶ必要があると思うのですが… ・下記でTypeErrorエラーになるのは、gooプロパティが2回呼ばれるから? ・明示的に呼んだ2回目は引数が渡らないから? var obj = {  portal : function( arg ) {   var goo = function(arg){    console.log(arg);   }(arg);   goo();  } } obj.portal("あ"); //TypeError: undefined is not a function

  • jqueryを使いajaxで取得したデータをコールバック関数外で取得する方法

    下記のようなスクリプトでjQueryを使い、ajaxでtextを取得します。 コールバック関数内では、もちろんtextが使えるのですが、コールバック関数外からはtextに一切アクセスできなくなります。 このようにグローバルからajaxで取得したデータは取得できないのでしょうか? prototype.jsでも同じ結果です。 グローバルからの取得法、ご存知の方いらっしゃいましたらご教示頂ければと思います。 <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript"><!-- $(document).ready(function (){ $.get("./sample.txt",function(text){ alert(text); // textが取得できる }); }); alert(text); // textが取得できない // --></script>

  • jQueryの関数内の変数について教えてください

    jQueryで外部の関数の中にある変数の値の取得方法について教えてください。 文法等全く分かっていない、初心者で大変恐縮しております。 外部にある変数の値を取得し、その値を必要な変数に代入したいと思っております。 下記に大まかなコードを記述いたしました。 サイトを開いた時に「mLivre」を実行し、リサイズ処理をした時に もう一度「mLivre」を実行しております。 「var mLivre」内にある数値を、「jQuery(window).resize」の中の 「 jQuery.fn.mLivre」の中にある変数に代入しようと思っております。 私のやりたいことは、「mLivre」というプラグイン(下記※参考サイト)を レスポンシブにしたいと思っております。 「mLivre」は画像を本の様にめくってくれるスクリプトです。 下記のコードの流れで、ブラウザサイズに合わせて表示の大きさを 変えることができましたが、リサイズするごとに初期化され ページが1ページ目からになってしまうので、 リサイズ後も変わらないページで表示させたいと思っております。 ※参考サイト http://coliss.com/articles/build-websites/operation/javascript/jquery-plugin-mlivre.html 全くの初心者で大変恐縮しておりますが、 ご享受いただけたらと思います。 また、記述についてもご指摘いらだけたら幸いです。 宜しくお願いいたします。 -------ソースコード---------- //実行外部ファイル jQuery('#slide').mLivre({ }); //コアファイル (function(jQuery) { jQuery.fn.mLivre = function(options,num) { }; jQuery(window).resize(function(){ var mLivre={ //ここにある変数の値を取得してリサイズ内の jQuery.fn.mLivreに渡したい。 } jQuery.fn.mLivre = function(options,num) { //この中の変数に代入したい }; jQuery('#slide').mLivre({  //リサイズ後の実行部 }) ; }); })(jQuery); var mLivre={ //ここにある変数の値を取得してリサイズ内の jQuery.fn.mLivreに渡したい。 }

  • JavascriptとJqueryを混在し記述

    JavascriptとJqueryが混在したスクリプトファイル(.js)の書き方について質問です。 Jquery自体がjavascriptで書かれており結局はjavascriptであるということは理解していますが 気になるので質問させてください。 通常、javascriptの書き方として、スクリプトやその関数定義を1つのjsファイルに書くと思いますが、 Jqueryが混在しても考えは一緒で、ただ、ページが全て読み込まれた後(要素を特定できるようにするため)に実行したい場合の スクリプトを $(function(){ //Jquryや通常のjavascript }); の中にこのように書けばいいって話ですよね? つまり1つのjsファイル内に以下のようにスクリプトを混在させた書き方でもいいのですよね? ===== script.js ====== //(1)Javaスクリプト ←jsファイルが読み込まれたら実行するスクリプト //関数定義 function test(){ //Javaスクリプト } //(2)Jquery ←ページが全て読み込まれた後で実行するスクリプト $(function(){ //Jqueryスクリプト //Javaスクリプト }); 初歩的なことかもしれませんがすいません。

  • JavaScriptの関数渡しに関して

    こんにちは。JavaScriptの関数の受け渡しで悩んでいます。 FileBからFileAへコールバックのような関数を渡し,その 関数にデータをセットして返して欲しいのですが,上手く 動きません。まず,下記ソースのファンクション:Registration にて, CallBackFunctionへ,FileBから送った関数が 上手く登録できていない気がします。 どのようにすれば良いのでしょうか? よろしくお願いいたします。 ------------------------------------------------- FileA.js ; var CallBackFunction; Registration = function( registrationFunction ){ CallBackFunction = registrationFunction; }, ; ; -----Do something ; ; SendData=function(data) { CallBackFunction( data ); } ------------------------------------------------- FileB.js ; document.onload(){ registration( myCallbackFunction ); }, myCallbackFunction( data ){ Alert( data ); } -------------------------------------------------

  • コールバック関数(?)をループしたいのですが………

    下記のようなコールバック関数(?)が10コ続いているとき、 for文か何かでループさせ分かりやすく書きたいのですが、どうすれば良いでしょうか? $('#id1').hoge(params, options, function(){  $('#id2').hoge(params, options, function(){   //処理  }); }); ※jQuery利用してます

専門家に質問してみよう