IT・WEB・ゲーム業界の転職に強いR-Stone

転職コラム

Javascriptのrequireって?scriptとの違いや基本的な使い方を学ぼう

JavaScriptのrequireは、Node.js環境で広く使用されるモジュール読み込み関数です。大規模なプログラムを複数の小さなファイルに分割し、必要な部分だけを効率的に読み込むことができます。

本記事では、requireの基本的な使い方や特徴、scriptタグやimportとの違い、使用時の注意点などを詳しく解説します。

モジュール化されたコードの管理方法を学び、より効率的なJavaScript開発を目指しましょう。

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を活用して、効率的なモジュール管理を始めてみましょう。