Javascriptのrequireって?scriptとの違いや基本的な使い方を学ぼう
JavaScriptのrequireは、Node.js環境で広く使用されるモジュール読み込み関数です。大規模なプログラムを複数の小さなファイルに分割し、必要な部分だけを効率的に読み込むことができます。
本記事では、requireの基本的な使い方や特徴、scriptタグやimportとの違い、使用時の注意点などを詳しく解説します。
モジュール化されたコードの管理方法を学び、より効率的なJavaScript開発を目指しましょう。
Contents
JavaScriptのrequireとは?
JavaScriptのrequire()を使うと、他のファイル(モジュール)に書かれたコードを簡単に使用できます。機能毎にプログラムの構造を整理でき、コードの再利用性が高まります。
例えば、以下のようにrequireを使用します。
const fs = require(‘fs’); // Node.jsの標準モジュール’fs’を読み込む
上記のコードでは、左辺の変数fsを通じてモジュールの機能にアクセスできます。
scriptとの違いとは
特徴 |
require |
<script>タグ |
動作環境 |
Node.jsなどのサーバーサイド |
WEBブラウザ |
読み込み |
同期的に読み込み、実行を一時停止 |
非同期で読み込み可能 |
スコープ |
モジュール内でのみ有効 |
グローバルスコープ |
依存関係管理 |
明示的に管理可能 |
読み込む順序に注意が必要 |
適用例 |
構造化コード管理、大規模開発 |
小規模向き |
requireはNode.jsなどのサーバーサイド環境で同期的にモジュールを読み込み、スコープを限定し依存関係を明示的に管理します。
一方、scriptタグはブラウザ環境で非同期にスクリプトをグローバルスコープで実行するため、読み込む順序に注意が必要です。
importとの違い
特徴 |
require |
import |
動作環境 |
主にNode.js |
主要ブラウザやNode.js(v13.2.0以降) |
インポート方法 |
動的インポート可能 |
静的インポート |
使用場所 |
関数内でも使用可能 |
コードの最上部 |
importはES6で導入され、ブラウザを含む多くの環境で使用でき、静的インポートが前提です。
requireは、動的インポートが可能ですが、主にNode.jsなどサーバー側で利用されます。
構文の違い
// importは文の形式を取る
import module from ‘./module’;
// requireは関数呼び出しの形式を取る
const module = require(‘./module’);
requireの特徴
requireは、同期的に動作します。つまり、コードの実行を一時停止して、必要なモジュールを読み込んでから次の処理に進みます。
また、requireは、どこでも使えます。条件分岐の中や関数の中でも使用でき、プログラムの実行中に必要に応じてモジュールを読み込めます。
requireは、モジュールが必要とする他のモジュール(依存関係)も自動的に読み込みます。例えば、モジュールAがモジュールBを必要としている場合、Aを読み込むと自動的にBも読み込まれます。
上記の特徴によって、require関数を使うと、 プログラムを柔軟にモジュール化できます。
requireの基本的な書き方やサンプルコード
require関数の基本的な構文は次のとおりです。
const モジュール名 = require(‘ファイルパスまたはモジュール名’);
基本的な読み込みの例は以下です。
const math = require(‘./math.js’); // 同じディレクトリにある「math.js」ファイルを読み込む例
const _ = require(‘lodash’); // npmパッケージ「lodash」を読み込む例
モジュールを分割して読み込むこともできます。
const { add, subtract } = require(‘./math.js’); // 「math.js」からadd, subtractのみ読み込む
条件に応じて異なるモジュールを読み込みたい場合は、次のように書きます。
let module;
if (condition) { // 条件分岐
module = require(‘./moduleA’);
} else {
module = require(‘./moduleB’);
} // moduleA・moduleBのどちらか一つが読み込まれた
サンプル: 計算モジュールをrequireする
球の体積を求めるモジュールを以下のとおり用意します。
// sphereVolume.js
function calculateSphereVolume(radius) {
return (4 / 3) * Math.PI * Math.pow(radius, 3);
}
module.exports = calculateSphereVolume;
上記モジュールをrequireで読み込み、体積を求めます。
// main.js (sphereVolume.jsと同じディレクトリに配置)
const calculateSphereVolume = require(‘./sphereVolume’);
const radius = 3;
const volume = calculateSphereVolume(radius);
console.log(`半径${radius}メートルの球の体積は約${volume.toFixed(2)}立方メートルです。`);
実行例
$ node main.js
半径3メートルの球の体積は約113.10立方メートルです。
requireを使うときの注意点
JavaScriptのrequire関数には、いくつかの重要な注意点があります。
まず、require関数はNode.js環境のサーバーやビルド工程でよく使われますが、WEBブラウザでは非対応です。ES6のモジュールと直接の互換性がないため、ブラウザでの使用にはimport/exportを用いるかwebpackなどのバンドラーを使用し、プロジェクト内でモジュールシステムを統一するのがおすすめです。
また、requireを使用して外部モジュールを読み込む場合、信頼できるモジュールか、確認する必要があります。第三者の作成したモジュールには悪意あるコードが含まれている場合もあるため、適切な検証をおこなったうえで利用してください。
まとめ
JavaScriptのrequireは、Node.js環境で外部モジュールを読み込むための関数です。scriptタグとは実行環境や読み込み方法が異なり、importとも構文や動作に違いがあります。大規模な開発に適していますが、使用時には動作環境やセキュリティに注意が必要です。
requireを活用して、効率的なモジュール管理を始めてみましょう。