মডিউলগুলো ES 2015-এ সংযুক্ত করা হয়েছিল। কোডকে ছোট ছোট টুকরোতে ভাগ করার জন্য মডিউলগুলো সংযুক্ত করা হয়েছিল। মডিউলগুলোতে ক্লাস বা ফাংশন থাকতে পারে। export এবং import কীওয়ার্ডগুলো ভেরিয়েবল, ফাংশন, অবজেক্ট এক্সপোর্ট এবং অন্যান্য ফাইলে ইম্পোর্ট করতে ব্যবহৃত হয়।
নোট - এই উদাহরণ চালানোর জন্য আপনাকে একটি লোকালহোস্ট সার্ভার চালাতে হবে।
জাভাস্ক্রিপ্ট মডিউলসের জন্য নিচের কোডটি দেখুন
INDEX.html
উদাহরণ
<!DOCTYPE html> <html lang="bn"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>জাভাস্ক্রিপ্ট মডিউলস</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>জাভাস্ক্রিপ্ট মডিউলস</h1> <button class="Btn">ইম্পোর্ট</button> <div class="result"></div> <h3>উপরোক্ত বাটনে ক্লিক করুন মডিউল ইম্পোর্ট করতে</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'; }
আউটপুট
প্রাথমিক অবস্থা:
'ইম্পোর্ট' বাটনে ক্লিক করার পর:
