web-dev-qa-db-ja.com

RequireJSライブラリの定義の説明

私はRequireJSに関するいくつかのチュートリアルを読み始めました。それらのどれにも「定義」キーワードは私にとって満足のいく説明がありませんでした。誰かが次のことで私を助けることができます：

define(
  ["Models/Person", "Utils/random", "jquery"], 
  function (Person, randomUtility, $) {..}
)

「定義」とは何ですか？配列とその中に匿名関数を持つ関数を定義していますか？それとも別のものですか？誰かがこの種の定義に関する詳細を教えてもらえますか？

追加：nnnnnnとpradeekの回答に感謝します。ここヨーロッパでは、質問を投稿していたのは夜の2時半でした。それゆえ、私はそれが単純な関数呼び出しであることを認識しなかったのかもしれません。

javascriptrequirejs
48
Wolfgang Adamec

defineはRequireJSに固有のものではなく、 AMD仕様 の一部です。 AMDはブラウザを念頭に置いていなかったため、RequireJSはAMDが指定したとおりにRequireJSを実装していないことにBurkeは気付くでしょう。

defineには匿名関数がありません。 defineは、AMDベースのJavaScriptファイルがデータをロードするために利用できるようにするメソッドです。 RequireJSのようなライブラリはこれを利用可能にします。特定の実装はおそらくあなたにとって価値がありません。モジュールを宣言する最も一般的な方法であるため、ここで提供したものを検討します。

define([array]、object);

配列は、このモジュールが依存するモジュールのリストです。モジュールとファイルの間には1対1の関係があります。 1つのファイルに複数のモジュールを含めることも、1つのモジュールに複数のファイルを含めることもできません。

オブジェクトは、定義するモジュールです。これは、何でも、構造体、または構造体を返す関数にすることができます。詳細については、 RequireJS のドキュメントを参照してください。

オブジェクトが関数の場合、関数に渡される引数は、最初の定義引数に依存関係としてリストされているモジュールです。関数をobjectとして渡すと、1回しか実行されないことに注意することも重要です。ただし、この1つのインスタンス化で作成されたメソッドまたはプロパティはいつでもアクセスでき、その後、このモジュールを依存関係としてリストする他のモジュールからアクセスできます。

幸運なことに、私はこれで遊んで、物事が意味をなさないときにドキュメントを読むことをお勧めします。 RequireJSのドキュメントは、AMDモジュールの動作方法のクイックスタートとして最適です。

61
Drew

Require.jsの下部でdefineが定義されていることを発見しました（私もこのdefine Wordがどんなものか疑問に思っていました。これが答えです[〜＃〜] i [〜＃〜]は探していました）：

/**
 * The function that handles definitions of modules. Differs from
 * require() in that a string for the module should be the first argument,
 * and the function to execute after dependencies are loaded should
 * return a value to define the module corresponding to the first argument's
 * name.
 */
define = function (name, deps, callback) {
    var node, context;

    //Allow for anonymous modules
    if (typeof name !== 'string') {
        //Adjust args appropriately
        callback = deps;
        deps = name;
        name = null;
    }

    //This module may not have dependencies
    if (!isArray(deps)) {
        callback = deps;
        deps = null;
    }

    //If no name, and callback is a function, then figure out if it a
    //CommonJS thing with dependencies.
    if (!deps && isFunction(callback)) {
        deps = [];
        //Remove comments from the callback string,
        //look for require calls, and pull them into the dependencies,
        //but only if there are function args.
        if (callback.length) {
            callback
                .toString()
                .replace(commentRegExp, '')
                .replace(cjsRequireRegExp, function (match, dep) {
                    deps.Push(dep);
                });

            //May be a CommonJS thing even without require calls, but still
            //could use exports, and module. Avoid doing exports and module
            //work though if it just needs require.
            //REQUIRES the function to expect the CommonJS variables in the
            //order listed below.
            deps = (callback.length === 1 ? ['require'] : ['require', 'exports', 'module']).concat(deps);
        }
    }

    //If in IE 6-8 and hit an anonymous define() call, do the interactive
    //work.
    if (useInteractive) {
        node = currentlyAddingScript || getInteractiveScript();
        if (node) {
            if (!name) {
                name = node.getAttribute('data-requiremodule');
            }
            context = contexts[node.getAttribute('data-requirecontext')];
        }
    }

    //Always save off evaluating the def call until the script onload handler.
    //This allows multiple modules to be in a file without prematurely
    //tracing dependencies, and allows for anonymous module support,
    //where the module name is not known until the script onload event
    //occurs. If no context, use the global queue, and get it processed
    //in the onscript load callback.
    (context ? context.defQueue : globalDefQueue).Push([name, deps, callback]);
};
5
BlueMonkMN

私はこのページを見つけました なぜAMD？ 非常に役に立ちました。このページから要約すると、AMDの仕様は、「手動で順序付けする必要がある暗黙的な依存関係を持つスクリプトタグの束を書く」問題を克服するのに役立ちます。必要な関数を実行する前に依存関係をロードするのに役立ちます。これは、Pythonなどの他のプログラミング言語のimportと同様です。 AMDは、グローバル名前空間の汚染問題も防ぎます。小切手 "It is an improvement over the web's current "globals and script tags" because" セクション。

1
vine'th