জাভাস্ক্রিপ্টে মডিউল কি?

মডিউলগুলি ES 2015-এ কোডগুলিকে ছোট ছোট টুকরোতে ভাঙার জন্য চালু করা হয়েছিল। মডিউলে ক্লাস বা ফাংশন থাকতে পারে। কীওয়ার্ড এক্সপোর্ট এবং ইম্পোর্ট ভেরিয়েবল, ফাংশন, অবজেক্ট রপ্তানি করতে এবং অন্যান্য ফাইলগুলিতে আমদানি করতে ব্যবহৃত হয়।

দ্রষ্টব্য − এই উদাহরণটি চালানোর জন্য আপনাকে একটি লোকালহোস্ট সার্ভার চালাতে হবে।

জাভাস্ক্রিপ্টে মডিউলের জন্য কোড নিচে দেওয়া হল

INDEX.html

উদাহরণ

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<style>
   body {
      font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
   }
   .result {
      font-size: 18px;
      font-weight: 500;
      color:blueviolet;
   }
</style>
</head>
<body>
<h1>Modules in JavaScript</h1>
<button class="Btn">IMPORT</button>
<div class="result"></div>
<h3>Click on the above button to import module</h3>
<script src="script.js" type="module"></script>
<script src="sample.js" type="module"></script>
</body>
</html>

script.js

import test from './sample.js';
document.querySelector('.Btn').addEventListener('click',()=>{
   test();
})

sample.js

let resultEle = document.querySelector(".result");
export default function testImport(){
   resultEle.innerHTML = 'Module testImport has been imported';
}

আউটপুট

'ইমপোর্ট' বোতামে ক্লিক করার পরে -

জাভাস্ক্রিপ্টে মডিউল কি?