CommonJS の詳細な例

零下一度
リリース: 2017-07-21 09:16:36
オリジナル
1980 人が閲覧しました

1. CommonJS

  • は、サーバー側のモジュールプログラミングに使用されます。

  • このメソッドは、ファイルを読み込むために使用されます。最後にファイル内の module.exports オブジェクトを返します。

  • require はデフォルトで .js ファイルを読み取るため、require (モジュール名) は同期的にロードされます。サーバーによってロードされるモジュールは通常ローカルであるため、このようになりますが、モジュールが大きすぎるとページが「偽装」されます。属性は現在のモジュールの外部出力インターフェイスを表し、他のファイルは実際には module.exports 変数を読み込みます。便宜上、exports を使用して module.exports をポイントすることもできます。つまり、exports = module です。 exports = {}

  • exports.xxx は、呼び出し元モジュールから見える、エクスポートされたオブジェクトに属性を追加するのと同等です。;

  • exports = これは、モジュールとの関連付けを切断するエクスポートの再割り当てと同等です。エクスポート、呼び出しモジュールはエクスポートのオブジェクトとプロパティにアクセスできません

  • モジュールの読み込み :require([module], function(module){}); define([module], function(module){}); module は依存モジュールです。

  • require.js (フロントエンド モジュラー管理ツール ライブラリ) は、Web ページが応答しなくなることを回避するために、js ファイルの非同期読み込みを実装します。モジュール間の依存関係を整理して、コードの作成とメンテナンスを容易にします。

依存関係プレフィックス、モジュール依存関係ブロックをできるだけ早く実行します。実行順序は必ずしも最初に 1、次に 2 である必要はありません。

  • 非標準モジュールをロードします

require.config({
    baseUrl: "js/lib",
    paths: {"jquery": "jquery.min",
    "underscore": "underscore.min",
    "backbone": "backbone.min"  },
    shim: {'underscore':{
            exports: '_'   },
   'backbone': {
    deps: ['underscore', 'jquery'],
    exports: 'Backbone'   }
 }
});
// exports值(输出的变量名),表明这个模块外部调用时的名称;deps数组,表明该模块的依赖性
ログイン後にコピー
  • 3。
  • define(function(require, exports, module){
        var a = require('a');
        a.foo();
    };
    ログイン後にコピー
  • Sea.js
  • 依存関係は近くにあり、依存モジュールは実際に必要な場合にのみ実行され、順序は固定されています
  • AMD と CMD の最大の違いは、依存モジュールの実行タイミングはロードではなく別の方法で処理され、どちらもモジュールを非同期でロードします
  • AMD は依存モジュールが誰であるかを簡単に知ることができます。 CMD は近くの依存関係に依存しているため、モジュールを使用して文字列に変換し、再度解析する必要があります。そのとき初めて、どのモジュールに依存しているかが分かりました

      以上がCommonJS の詳細な例の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

      関連ラベル:
      ソース:php.cn
      このウェブサイトの声明
      この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
      最新の問題
      人気のチュートリアル
      詳細>
      最新のダウンロード
      詳細>
      ウェブエフェクト
      公式サイト
      サイト素材
      フロントエンドテンプレート