require を使用してモジュール式 JavaScript ファイルを読み取る方法

require は通常、モジュール型 JavaScript ファイルを読み取るために使用されます。この記事では、モジュール型 JavaScript ファイルを読み取るために require を使用する方法を紹介します。

通常、JavaScript プログラムを読み込むときは、script タグを使用して HTML を記述しますが、Node.js のようにサーバー側で JavaScript を別途実行する場合、その場合、Scriptタグは使用できません。したがって、モジュール式 JavaScript ファイルをそこから読み取って実行できます。

まず、Node.js の require

require の基本的な使い方を見てみましょう。require は、npm で読み取られるモジュールに対して JavaScript 側で使用できるメソッドです。 。

var 变量 = require( 模块名称 );

上記のコードでは、ロードするモジュールの名前を require パラメーターとして指定するだけです。

ロードされたモジュールは指定された変数に格納されるため、汎用 JavaScript インスタンスの作成と似ています。

こうすることで、script タグを使わずに JavaScript だけでモジュール（ライブラリ）を読み込んで使用することができます。

見てみましょうモジュールをロードする方法は?

以下の例を見てください

var gulp = require('gulp');
gulp.task('clean', function() {
    //在此描述gulp的处理
});

この例では、requireパラメータで読み込むモジュール名としてgulpが指定されていることがわかります。

これにより、JavaScript側でgulpを使用し、自動化したい業務処理を記述することができます。

RequireJS の使用方法?

RequireJS を使用して JavaScript ファイルを読み取る

フロントエンド ブラウザーで Require を使用する方法

JavaScript ファイルが分割され、数が増えると、script タグだけで管理することが困難になります。

ただし、フロントエンド (ブラウザー) では、Node.js などの必須ファイルの使用が提供されません。

そこで、RequireJSというライブラリを利用することができます。

これにより、フロントエンドの require を通じてファイルをロードできるようになります。

ただし、構文（書き方）が若干異なるため、以下の例をよく確認してください。

require(加载的文件名,函数处理)

1 つ異なるのは、読み込む JavaScript ファイルが require の最初のパラメータで指定されることです。配列として指定できるため、複数のファイルの読み込みもサポートできます。

その後、第二引数の関数処理で読み込んだファイルを元にJavaScriptコードを記述します。

RequireJSを使ったJSファイルの読み込み方法

RequireJSで読み込む場合、define()に元のJavaScriptファイルのコードを記述する必要があります。

たとえば、sample.js というファイルを作成し、次のように記述します。

define(function() {
    return function(num) {
 
        return num * num;
 
    };
});

これは、任意の数値を 2 乗できる単純な関数です。

この処理をdefine()に記述し、returnで返すことで実現されます。

次に、次のように require を使用してsample.jsを読み込みます。

require(['sample'], function(num) {
 
  var result = num(10);
  
  console.log(result);
 
});

実行結果

100

requireの第一引数にファイル名として「sample」を設定し、関数内でsquareを返すことで設定されていることがわかります。

num(10)と記述することで、「sample.js」に定義されている関数を利用することができます。

実行結果を確認すると、二乗値が得られていることがわかります。

以上がrequire を使用してモジュール式 JavaScript ファイルを読み取る方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。