داینامیک imports در جاوا‌اسکریپت

شاید این سوال برای شما هم پیش آمده باشد که چگونه برخی فریمورک‌های جاوا‌اسکریپتی مانند nextjs شما را مجبور می‌کنند برای اینکهpage، controller و یا…. ایجاد کنید بهتر است، آن‌ها را در فولدر همنام‌شان مثل controllers یا pages بنویسید.

خب در هسته این فریمورک‌ها نام این دایرکتوری‌ها به صورت پیش فرض نوشته شده است که برخی از آن‌ها به شما اجازه overwrite کردن این دایرکتوری‌ها را می‌دهند و برخی هم نه؛ که موضوع و هدف این مقاله بحث درباره این فریمورک‌ها نیست بلکه به پیاده سازی آن می‌پردازیم.

به دایرکتوری پروژه زیر نگاه کنید.

/src

  |__controllers

  |__lib

  |__models

  |__routes

  |__services

App.js

Index.js

در این پروژه ما به دلیل اینکه models را در controllers استفاده کنیم قطعا باید در هر کنترلر که نیازی به ارتباط با دیتابیس دارد، باید schema متناسب با را import یا require کنیم.

اول بیایید به دایرکتوری models بپردازیم و همه schema‌ها را به آبجکت models اضافه کنیم؛ چگونه!؟ با استفاده ماژول fs و path.

به کد زیر توجه کنید:

const { readdirSync } = require("fs")
const { resolve } = require("path")

const models = {}

// Read schemas
const schemas = readdirSync(resolve(__dirname)).filter((item) => !item.match("index.js"))

// Import schema to models
for (const schema of schemas) {
	const key = schema[0].toUpperCase() + schema.slice(1).replace(".js", "")
	models[key] = require(`${resolve(__dirname, schema)}`)
}

module.exports = models

یک فایل با نام index.js در دایرکتوری models ایجاد کردیم و کد بالا را قرار دادیم. این کد به چه صورت کار می‌کند، متد readdirSync از ما یک مسیر به عنوان پارامتر می‌گیرد، همه فایل‌ها و فولدر‌هایی که داخل آن مسیر وجود دارد را در یک آرایه برمی‌گرداند؛ البته ما نمی‌خواهیم index.js در این آرایه وجود داشته باشد پس باید آن را فیلتر کنیم. حال نوبت به پیمایش schemas می‌رسد خب ما اول از همه می‌خواهیم حرف اول هر schema به صورت حرف بزرگ (uppercase) باشد و بقیه حرف به صورت کوچک البته این را هم فراموش نکنید که باید پسوند‌ آن‌ها یعنی js. را باید حذف کنیم، پس از همه این کار‌ها باید آن‌ها را به آبجکت models اضافه و از آن export بگیریم.

حال شما می‌توانید آبجکت models را به صورت global تعریف کنید تا در هر جا برنامه که نیاز دارید، استفاده کنید یا فقط در controllers استفاده کنید.

در این پروژه همه کنترلر‌ها از کلاس baseController ارث‌بری می‌کنند که می‌توانیم از این کلاس برای اضافه کردن models به کنترلر‌ها استفاده نماییم. به کلاس baseController توجه کنید:

const models = require("../models")

module.exports = class BaseController {
	constructor () {
		// Set models
		this[Symbol.for("models")] = models
                    }
   /** Show public info message
   * @param {response} express.response
   * @param {number} status
   * @param {object} data
   * @return response
   */
    infoMessage (res, status, data) {
          res.status(status).json(data)
    }
}

در constructor ما یک symbol تعریف کردیم و آن را با آبجکت models مقدار‌دهی کردیم.

نکته: symbol‌ها در es6 اضافه شدند و نوعی تایپ جدید در جاوا‌اسکریپت است که یک مقدار unique تولید می‌کند. خب چرا ما باید از symbol‌ها استفاده کنیم؟ شما گاهی اوقات نیاز دارید تا در برنامه خود یک مقدار unique تولید کنید که فقط در همان فایل قابل دسترس باشد یا با نام همان symbol به مقدار آن در جای دیگر استفاده کنیم و طرف دیگر اگر با زبان‌های دیگری همچون جاوا، سی پلاس پلاس کار کرده باشید باAccess Modifiers آشنایی دارید، با آمدن es6 و اضافه شدن کلاس‌ها به جاوا‌اسکریپت، مفهوم Access Modifiers را نمی‌توان در آن‌ها پیاده سازی کرد و همه متد‌ها و خصوصیات یک کلاس public بوده. حال ما می‌توانیم با symbol‌ها این مفهوم را پیاده سازی کنیم و علت استفاده آن در کلاس‌ baseController پیاده سازی همین ویژگی بوده است.

خلاصه

در این مقاله با داینامیک imports آشنا شدیم و به برخی از ویژگی‌هایی که در es6 به جاوا‌اسکریپت اضافه شدن پرداختیم، اگر شما هنوز با این ویژگی‌ها آشنایی ندارید به شما دوره آموزش جاوا‌اسکریپت es6 را پیشنهاد می‌کنم.