RequireJS এর মূল অংশ হিসেবে দুটি গুরুত্বপূর্ণ ফাংশন রয়েছে: define() এবং require()। এই দুটি ফাংশন ব্যবহৃত হয় মডিউল লোডিং, ডিপেনডেন্সি ম্যানেজমেন্ট, এবং অ্যাসিনক্রোনাস লোডিংয়ের জন্য। তাদের ব্যবহারের মাধ্যমে আপনি আপনার কোডের মডুলার এবং পুনঃব্যবহারযোগ্য অংশ তৈরি করতে পারবেন।
1. define() ফাংশন
define() ফাংশনটি মডিউল সংজ্ঞায়িত (define) করতে ব্যবহৃত হয়। এর মাধ্যমে আপনি এক বা একাধিক ফাংশন বা অবজেক্টকে একটি মডিউল হিসেবে ঘোষণা করতে পারেন। সাধারণত, define() ফাংশনটি ব্যবহার করা হয় যখন আপনি একটি নতুন মডিউল তৈরি করতে চান এবং এর ডিপেনডেন্সি (অথবা প্রয়োজনীয় মডিউল) চিহ্নিত করতে চান।
Syntax:
define([dependencies], function() {
// Module code here
});
dependencies: একটি অ্যারে, যা মডিউলের নির্ভরশীলতা (dependencies) তালিকাবদ্ধ করে। এগুলি আপনার মডিউলের জন্য যেসব মডিউল প্রয়োজন, যেমনjquery,lodash, ইত্যাদি।- Callback Function: এটি একটি ফাংশন যা আপনার মডিউল তৈরির সময় রান হয় এবং মডিউলের কোড (যেমন ফাংশন বা অবজেক্ট) রিটার্ন করে।
উদাহরণ: define() ব্যবহার করে একটি মডিউল তৈরি করা
// math.js
define([], function() {
return {
add: function(a, b) {
return a + b;
},
subtract: function(a, b) {
return a - b;
}
};
});
এখানে, math.js নামে একটি মডিউল তৈরি করা হয়েছে, যা দুটি ফাংশন add এবং subtract রিটার্ন করে।
2. require() ফাংশন
require() ফাংশনটি ব্যবহৃত হয় মডিউলগুলো লোড করতে এবং তাদের ডিপেনডেন্সি (যা define() ফাংশনে উল্লেখ করা হয়) পূর্ণ করার জন্য। require() ফাংশনটি মূলত মডিউলগুলিকে নির্দিষ্ট করে এবং নিশ্চিত করে যে ডিপেনডেন্সিগুলি আগে লোড হবে। এটি অ্যাসিনক্রোনাস মডিউল লোডিংয়ের জন্য ব্যবহৃত হয়, তাই কোড দ্রুত লোড হতে পারে এবং ইউজার এক্সপেরিয়েন্স উন্নত হয়।
Syntax:
require([modules], function(module1, module2) {
// Use the loaded modules here
});
modules: একটি অ্যারে যা সেই মডিউলগুলির নাম (যেগুলি আপনি লোড করতে চান) নির্দেশ করে।- Callback Function: এই ফাংশনটি তখন কল হয় যখন সমস্ত মডিউল লোড হয়ে যাবে। এখানে, আপনি মডিউলগুলির রিটার্ন করা মানগুলো প্যারামিটার হিসেবে পাবেন এবং তাদের ব্যবহার করতে পারবেন।
উদাহরণ: require() ফাংশন ব্যবহার করে মডিউল লোড করা
// main.js
require(['math'], function(math) {
console.log(math.add(2, 3)); // Output: 5
console.log(math.subtract(5, 3)); // Output: 2
});
এখানে, আমরা require() ফাংশন ব্যবহার করে math.js মডিউলটি লোড করেছি এবং তার পরে add এবং subtract ফাংশন ব্যবহার করেছি।
define() এবং require() এর মধ্যে পার্থক্য:
| ফিচার | define() | require() |
|---|---|---|
| ব্যবহার | নতুন মডিউল তৈরি এবং ডিপেনডেন্সি নির্ধারণ করা। | মডিউল লোড এবং ডিপেনডেন্সি পূর্ণ করা। |
| অ্যাসিনক্রোনাস লোডিং | হ্যাঁ, মডিউলকে অ্যাসিনক্রোনাসভাবে লোড করা যায়। | হ্যাঁ, এটি মডিউলকে অ্যাসিনক্রোনাসভাবে লোড করে। |
| প্রধান কাজ | একটি মডিউল তৈরি করা। | এক বা একাধিক মডিউল লোড করা এবং সেগুলির ডিপেনডেন্সি পূর্ণ করা। |
| কখন ব্যবহার করবেন | যখন একটি নতুন মডিউল তৈরি করতে চান। | যখন আপনি একটি মডিউল লোড করতে চান এবং ব্যবহার করতে চান। |
আরেকটি উদাহরণ: define() এবং require() একসাথে ব্যবহার করা
// utility.js (Define)
define([], function() {
return {
greet: function(name) {
return "Hello, " + name + "!";
}
};
});
// app.js (Require)
require(['utility'], function(utility) {
console.log(utility.greet('Alice')); // Output: Hello, Alice!
});
এখানে:
utility.jsএকটি মডিউল তৈরি করেছে যা একটিgreetফাংশন রিটার্ন করে।app.jsমডিউলেutilityমডিউলটি লোড করা হয়েছে এবংgreetফাংশনটি ব্যবহার করা হয়েছে।
সারাংশ:
define()ফাংশনটি নতুন মডিউল তৈরি করতে ব্যবহৃত হয় এবং তার ডিপেনডেন্সি নির্দেশ করে। এটি কোডকে মডুলার এবং পুনঃব্যবহারযোগ্য করতে সাহায্য করে।require()ফাংশনটি মডিউলগুলো লোড করতে এবং তাদের ডিপেনডেন্সি পূর্ণ করতে ব্যবহৃত হয়, এবং এটি অ্যাসিনক্রোনাসভাবে মডিউল লোড করার সুবিধা দেয়।
RequireJS ব্যবহার করে আপনার অ্যাপ্লিকেশনকে আরও কার্যকর এবং সুসংগঠিত করা যায়, কারণ এটি মডিউল ভিত্তিক কোডিংয়ের মাধ্যমে ডিপেনডেন্সি ম্যানেজমেন্ট এবং অ্যাসিনক্রোনাস লোডিং সহজ করে তোলে।
define() ফাংশন RequireJS এর একটি গুরুত্বপূর্ণ ফাংশন, যা মডিউল ডিফাইন করতে ব্যবহৃত হয়। এটি আপনার কোডকে ছোট এবং মডুলার আকারে সাজাতে সাহায্য করে, যেখানে একাধিক মডিউল নির্দিষ্ট ডিপেনডেন্সি এবং ফাংশনালিটি সহ ডিফাইন করা যায়। define() ফাংশনের মাধ্যমে আপনি একটি মডিউল তৈরি করতে পারেন, যা অ্যাসিঙ্ক্রোনাসভাবে লোড হয় এবং মডিউলের নির্ভরশীলতা রেজলভ করে।
define() ফাংশনের Syntax:
define([dependencies], factory);
dependencies(Optional): এটি একটি অ্যারে যা সেই মডিউলগুলির নাম ধারণ করে, যেগুলির উপর আপনার মডিউল নির্ভরশীল। এগুলো মডিউল লোড করার আগে লোড হতে হবে। এটি অপশনাল, তবে এটি নির্দিষ্ট করা থাকলে আপনি মডিউলের ডিপেনডেন্সি একে অপরের ওপর নির্ভর করতে পারবেন।factory: এটি একটি ফাংশন বা অবজেক্ট হতে পারে যা আপনার মডিউলকে রিটার্ন করে। মডিউলটি লোড হয়ে গেলে, এটিfactoryফাংশনটিকে কল করে এবং মডিউলটি সরবরাহ করে।
define() ফাংশনের ব্যবহার উদাহরণ:
১. মডিউল ডিফাইন করা (No dependencies):
যদি আপনার মডিউলের কোন নির্ভরশীলতা না থাকে, তবে আপনি define() ফাংশনটিকে একটি ফাংশন বা অবজেক্ট দিয়ে ডিফাইন করতে পারেন।
// math.js
define(function() {
return {
add: function(a, b) {
return a + b;
},
subtract: function(a, b) {
return a - b;
}
};
});
ব্যাখ্যা:
- এখানে,
math.jsমডিউলটি একটি অবজেক্ট রিটার্ন করছে যার মধ্যেaddএবংsubtractফাংশন রয়েছে। এটি কোন নির্ভরশীলতা ছাড়াই একটি স্বাধীন মডিউল।
২. মডিউল ডিফাইন করা (With dependencies):
যদি আপনার মডিউল অন্য মডিউলগুলির ওপর নির্ভরশীল হয়, তবে আপনি define() এর মধ্যে ডিপেনডেন্সি হিসেবে তাদের অ্যারে পাস করতে পারেন।
// app.js
define(['math'], function(math) {
var sum = math.add(3, 4);
console.log('Sum: ' + sum); // Output: Sum: 7
});
ব্যাখ্যা:
- এখানে,
app.jsমডিউলটিmath.jsমডিউলের উপর নির্ভরশীল।mathমডিউলটি প্রথমে লোড হবে এবং তারপরaddফাংশনটি ব্যবহার করা হবে।
৩. নির্দিষ্ট অবজেক্ট রিটার্ন করা (Returning an Object):
আপনি define() ফাংশন দিয়ে সরাসরি একটি অবজেক্ট বা ফাংশনও রিটার্ন করতে পারেন, যেমন:
// person.js
define(function() {
return {
name: 'John Doe',
age: 30,
greet: function() {
console.log('Hello, ' + this.name);
}
};
});
এখানে person.js মডিউলটি একটি অবজেক্ট রিটার্ন করছে, যার মধ্যে name, age, এবং greet() ফাংশন রয়েছে। এই মডিউলটি অন্য মডিউল দ্বারা ব্যবহার করা যাবে।
৪. Named Module (নাম দেওয়া মডিউল):
আপনি একটি নামযুক্ত মডিউলও ডিফাইন করতে পারেন, যা একটি non-anonymous মডিউল তৈরি করবে।
// Define named module
define('mathModule', [], function() {
return {
add: function(a, b) {
return a + b;
}
};
});
ব্যাখ্যা:
- এখানে,
mathModuleএকটি নাম দেওয়া মডিউল। এটি যখন অন্য কোথাও ব্যবহার হবে, তখন এই নামটি দিয়েই রেফারেন্স করা যাবে।
৫. মডিউল ডিপেনডেন্সির ফিচার ব্যবহার:
আপনি একাধিক মডিউলকে নির্ভরশীলতার মধ্যে রাখতে পারেন এবং define() ফাংশন ব্যবহার করে তাদের সমন্বিতভাবে লোড করতে পারেন।
// moduleA.js
define(['jquery'], function($) {
return {
changeTitle: function() {
$('h1').text('Title Changed!');
}
};
});
// moduleB.js
define(['jquery'], function($) {
return {
hideTitle: function() {
$('h1').hide();
}
};
});
এখানে, moduleA.js এবং moduleB.js উভয়ই jquery মডিউলের উপর নির্ভরশীল। এইভাবে আপনি একাধিক ডিপেনডেন্সি মডিউলের সাথে কাজ করতে পারেন।
define() এর সুবিধা:
- ডিপেনডেন্সি ম্যানেজমেন্ট: আপনি সহজে একাধিক মডিউল তৈরি করতে পারেন এবং তাদের মধ্যে নির্ভরতাগুলি ম্যানেজ করতে পারেন। এতে কোডের কাঠামো পরিষ্কার এবং রক্ষণাবেক্ষণযোগ্য হয়।
- অ্যাসিঙ্ক্রোনাস লোডিং:
define()ফাংশন অ্যাসিঙ্ক্রোনাসভাবে মডিউল লোড করার জন্য ব্যবহৃত হয়, যা পেজ লোডিং সময় কমিয়ে দেয়। - ডিপেনডেন্ট মডিউল:
define()এর মাধ্যমে ডিপেনডেন্সি সরবরাহ করা সহজ হয় এবং নির্ভরশীল মডিউলগুলির সঠিক লোডিং নিশ্চিত করা হয়।
সারসংক্ষেপ:
define() ফাংশন RequireJS এর প্রধান ফাংশন যা মডিউল ডিফাইন করার জন্য ব্যবহৃত হয়। এটি একাধিক নির্ভরশীলতা সমন্বিতভাবে লোড করতে সাহায্য করে এবং অ্যাসিঙ্ক্রোনাসভাবে মডিউলকে ম্যানেজ করতে সক্ষম করে। define() ব্যবহার করে আপনি মডিউল তৈরি করতে পারেন যা কোনো নির্ভরশীলতার ভিত্তিতে কোডের পুনঃব্যবহারযোগ্যতা এবং পারফরম্যান্স উন্নত করতে সহায়ক।
require() ফাংশন হল RequireJS-এর মূল অংশ, যা modules লোড করার জন্য ব্যবহৃত হয়। এটি মডিউলগুলির ডিপেনডেন্সি ম্যানেজমেন্ট এবং লোডিং প্রক্রিয়া সহজ করে দেয়। require() ফাংশন ব্যবহার করে, আপনি নির্দিষ্ট মডিউল বা স্ক্রিপ্টগুলিকে অ্যাসিঙ্ক্রোনাসভাবে লোড করতে পারেন এবং সেই মডিউলগুলির মধ্যে ডিপেনডেন্সি ম্যানেজ করতে পারেন।
require() ফাংশনের ভূমিকা এবং কাজ:
1. মডিউল লোডিং:
require() ফাংশনের মূল কাজ হলো মডিউলগুলোকে লোড করা। এটি অ্যাসিঙ্ক্রোনাসভাবে নির্দিষ্ট মডিউলগুলির লোডিং প্রক্রিয়া পরিচালনা করে, যাতে একাধিক মডিউল লোড করার সময় পেজের পারফরম্যান্সে কোনও সমস্যা না হয়।
2. ডিপেনডেন্সি ম্যানেজমেন্ট:
require() ফাংশন ব্যবহার করে আপনি মডিউলগুলির মধ্যে ডিপেনডেন্সি ম্যানেজ করতে পারেন। আপনি যে মডিউলটি লোড করতে চান, তার জন্য প্রয়োজনীয় অন্য মডিউলগুলোকে উল্লেখ করতে পারেন। এটি নিশ্চিত করে যে, মডিউলটি লোড হওয়ার আগে তার ডিপেনডেন্সি মডিউলগুলো সঠিকভাবে লোড হয়ে গেছে।
3. Callback Function:
require() ফাংশন একটি callback ফাংশন নেয়, যা নির্দিষ্ট মডিউলগুলো লোড হওয়ার পর কল হয়। এই callback ফাংশনের মাধ্যমে আপনি লোড হওয়া মডিউলগুলো ব্যবহার করতে পারেন।
require() ফাংশনের সিনট্যাক্স:
require([dependencies], function() {
// Callback function where you use the loaded modules
});
dependencies: এটি একটি অ্যারে যা মডিউলগুলির নাম ধারণ করে যেগুলো আপনি লোড করতে চান।callback function: মডিউলগুলো লোড হওয়ার পরে যে ফাংশনটি চালানো হবে।
উদাহরণ:
// main.js
require(['module1', 'module2'], function(module1, module2) {
console.log('Modules loaded successfully');
module1.someFunction();
module2.anotherFunction();
});
এখানে:
module1এবংmodule2হল মডিউলগুলি যাrequire()ফাংশন ব্যবহার করে লোড করা হয়েছে।- যখন এই মডিউলগুলি লোড হয়ে যাবে, তখন
callback functionএক্সিকিউট হবে এবং এই মডিউলগুলির মধ্যে ব্যবহৃত ফাংশনগুলো কল করা হবে।
require() এর কাজের ধাপসমূহ:
- ডিপেনডেন্সি রেজল্যুশন:
require()প্রথমে মডিউলগুলোর ডিপেনডেন্সি রেজলভ করে, অর্থাৎ কোন মডিউলগুলি অন্য মডিউলগুলির উপর নির্ভরশীল তা চিহ্নিত করে। - মডিউল লোডিং: এরপর, তা সেগুলোকে লোড করে অ্যাসিঙ্ক্রোনাসভাবে।
- ডিপেনডেন্সি ইনজেকশন: যখন সব ডিপেনডেন্সি লোড হয়ে যায়, তখন
callbackফাংশনটি চালু হয় এবং প্রতিটি মডিউলকে ইনজেক্ট করে ব্যবহারযোগ্য করে তোলে।
require() এর সুবিধাসমূহ:
- অ্যাসিঙ্ক্রোনাস লোডিং: এটি মডিউলগুলো অ্যাসিঙ্ক্রোনাসভাবে লোড করে, যা পেজ লোডিংয়ের সময়কে দ্রুত করে এবং পারফরম্যান্স উন্নত করে।
- মডিউল নির্ভরতা: আপনি একাধিক মডিউলগুলির মধ্যে ডিপেনডেন্সি ম্যানেজ করতে পারেন এবং তাদের লোড করার সঠিক সময় নিশ্চিত করতে পারেন।
- স্কেলেবিলিটি: অ্যাপ্লিকেশন বড় হলে, RequireJS আপনাকে কোডের বিভিন্ন অংশগুলো পৃথকভাবে লোড করার মাধ্যমে অ্যাপ্লিকেশনকে মডুলার এবং স্কেলেবল রাখে।
- কোড স্প্লিটিং: বড় অ্যাপ্লিকেশনগুলির জন্য, আপনি শুধুমাত্র প্রয়োজনীয় মডিউলগুলো লোড করতে পারেন, যা কোড স্প্লিটিং এবং অপটিমাইজেশন নিশ্চিত করে।
আরও একটি উদাহরণ:
// app.js
define(['utils', 'math'], function(utils, math) {
utils.sayHello();
console.log(math.add(2, 3));
});
// utils.js
define([], function() {
return {
sayHello: function() {
console.log('Hello from utils!');
}
};
});
// math.js
define([], function() {
return {
add: function(a, b) {
return a + b;
}
};
});
এখানে:
app.jsমডিউলutilsএবংmathমডিউলগুলির উপর নির্ভরশীল এবং সেগুলোকেrequire()ফাংশন দিয়ে লোড করা হচ্ছে।utilsমডিউলটি একটি ফাংশনsayHelloপ্রদান করে এবংmathমডিউলটিaddফাংশন প্রদান করে।
সারসংক্ষেপ:
require() ফাংশন RequireJS এর মধ্যে একটি গুরুত্বপূর্ণ ফাংশন যা অ্যাসিঙ্ক্রোনাসভাবে মডিউল লোড করতে সাহায্য করে এবং ডিপেনডেন্সি ম্যানেজমেন্টের কাজটি সঠিকভাবে করে থাকে। এর মাধ্যমে, আপনি আপনার কোডের বিভিন্ন অংশ মডুলারভাবে লোড করতে পারেন এবং এটির মাধ্যমে পারফরম্যান্স উন্নত করা যায়।
RequireJS-এ define এবং require দুটি গুরুত্বপূর্ণ ফাংশন যা মডিউল ব্যবস্থাপনা এবং নির্ভরশীলতা পরিচালনা করতে ব্যবহৃত হয়। যদিও তারা একে অপরের সাথে সম্পর্কিত, তবে তাদের কাজের ক্ষেত্র এবং উদ্দেশ্য আলাদা।
১. define ফাংশন
define ফাংশনটি মডিউল ঘোষণা করতে ব্যবহৃত হয়। এটি একটি নতুন মডিউল তৈরি করে এবং সেই মডিউলের জন্য নির্ভরশীলতা (dependencies) এবং কার্যকারিতা (functionality) নির্ধারণ করে।
define এর ব্যবহার:
defineএকটি মডিউল ডিফাইন করে।- এটি মডিউলকে পাবলিক করে তোলে এবং অন্য মডিউলগুলো সেই মডিউলটিকে ব্যবহার করতে পারে।
- একটি মডিউলের জন্য নির্ভরশীলতা এবং কার্যকারিতা উল্লেখ করতে পারে।
উদাহরণ:
// example.js
define(['jquery', 'backbone'], function($, Backbone) {
// মডিউলটি ডিফাইন করা হল এবং নির্ভরশীলতা হিসেবে jQuery এবং Backbone ব্যবহৃত হচ্ছে
var myModule = {
initialize: function() {
console.log('Module Initialized');
}
};
return myModule;
});
এখানে define ব্যবহার করে একটি মডিউল তৈরি করা হয়েছে যা jquery এবং backbone মডিউলগুলির উপর নির্ভরশীল। যখন এই মডিউলটি লোড হবে, তখন এটি myModule অবজেক্ট রিটার্ন করবে।
২. require ফাংশন
require ফাংশনটি একটি মডিউলকে লোড এবং এটি ব্যবহার করতে ব্যবহৃত হয়। এর মাধ্যমে আপনি নির্দিষ্ট মডিউল বা মডিউলগুলিকে অ্যাপ্লিকেশন বা স্ক্রিপ্টের মধ্যে আমদানি করতে পারেন।
require এর ব্যবহার:
requireমডিউল বা মডিউলগুলির উপর নির্ভরশীলতা লোড করে এবং তাদের কার্যকারিতা অ্যাক্সেস করে।- এটি একটি আসিনক্রোনাস ফাংশন যা মডিউলগুলি লোড হওয়ার পরেই ফাংশন কল করে।
উদাহরণ:
// main.js
require(['example'], function(exampleModule) {
// 'example' মডিউলটি লোড করা হচ্ছে
exampleModule.initialize(); // মডিউলটি থেকে initialize ফাংশন কল করা হচ্ছে
});
এখানে, require ফাংশনটি example.js মডিউলটি লোড করে এবং তার পরে initialize ফাংশন কল করছে।
৩. define এবং require এর মধ্যে পার্থক্য
| Feature | define | require |
|---|---|---|
| মূল উদ্দেশ্য | নতুন মডিউল ডিফাইন করা | মডিউল লোড করা এবং সেটি ব্যবহার করা |
| ফাংশনের কাজ | মডিউল তৈরি করে এবং নির্ভরশীলতা উল্লেখ করে | নির্ভরশীলতা পূর্ণ হলে মডিউল ফাংশন চালায় |
| নির্ভরশীলতা | মডিউল ডিফাইন করার সময় নির্ভরশীলতা উল্লেখ করা হয় | নির্ভরশীলতা স্বয়ংক্রিয়ভাবে লোড এবং ব্যবহৃত হয় |
| ব্যবহার | যখন একটি নতুন মডিউল তৈরি করতে হয়, তখন define ব্যবহার করা হয় | যখন মডিউল লোড করা এবং এর কার্যকারিতা ব্যবহার করা হয় |
| ফাংশন ব্যবহার | মডিউল রিটার্ন করার জন্য ফাংশন ব্যবহার করা হয় | লোড হওয়া মডিউলের কার্যকারিতা অ্যাক্সেস করার জন্য ফাংশন ব্যবহার করা হয় |
৪. সংক্ষেপে
define: এটি মডিউল তৈরি করে, যেখানে আপনি মডিউল ডিফাইন করেন এবং নির্ভরশীলতা উল্লেখ করেন। এটি মডিউলকে বাইরে প্রকাশ (export) করে যাতে অন্য মডিউলগুলি এটিকে ব্যবহার করতে পারে।require: এটি মডিউল লোড করে এবং আপনার অ্যাপ্লিকেশনে সেটি ব্যবহার করে। যখন সব নির্ভরশীলতা লোড হয়ে যাবে, তখনrequireফাংশনটি কল করা হয় এবং মডিউলটির কার্যকারিতা পাওয়া যায়।
এটি আপনাকে মডিউল ব্যবস্থাপনা সহজ করে তোলে এবং অ্যাসিনক্রোনাসভাবে মডিউলগুলো লোড করতে সাহায্য করে।
RequireJS একটি জনপ্রিয় JavaScript module loader যা Asynchronous Module Definition (AMD) স্ট্যান্ডার্ড ব্যবহার করে মডিউলগুলি অ্যাসিঙ্ক্রোনাসভাবে লোড করতে সহায়তা করে। এটি বড় অ্যাপ্লিকেশনগুলিতে কোডের পৃথক অংশগুলোকে মডিউল আকারে ভাগ করে এবং নির্ভরশীলতা (dependencies) সঠিকভাবে ম্যানেজ করতে সহায়তা করে।
RequireJS-এ বিভিন্ন মডিউল লোড করার পদ্ধতি রয়েছে, যা আপনাকে কোডকে মডুলার, পুনঃব্যবহারযোগ্য এবং রক্ষণাবেক্ষণযোগ্য করে তুলতে সাহায্য করবে।
RequireJS-এ মডিউল লোড করার প্রধান পদ্ধতিগুলি:
require()ফাংশন ব্যবহার করে মডিউল লোড করাdefine()ফাংশন ব্যবহার করে মডিউল তৈরি এবং রেজিস্টার করা- ডিপেনডেন্সি ম্যানেজমেন্ট
- সিঙ্গেল মডিউল লোডিং
- মাল্টিপল মডিউল লোডিং
১. require() ফাংশন ব্যবহার করে মডিউল লোড করা
require() হল RequireJS এর একটি ফাংশন যা মডিউল লোড করতে ব্যবহৃত হয়। require() ফাংশনটি একটি বা একাধিক মডিউল অ্যাসিঙ্ক্রোনাসভাবে লোড করে এবং তাদের ডিপেনডেন্সি পূর্ণ হলে একটি কলব্যাক ফাংশন চালু করে।
উদাহরণ:
require(['module1', 'module2'], function(module1, module2) {
// Code that uses module1 and module2
console.log(module1.sayHello());
console.log(module2.sayGoodbye());
});
এখানে, module1 এবং module2 অ্যাসিঙ্ক্রোনাসভাবে লোড হবে এবং যখন সব কিছু লোড হয়ে যাবে, তখন কলব্যাক ফাংশনটি চালু হবে।
২. define() ফাংশন ব্যবহার করে মডিউল তৈরি এবং রেজিস্টার করা
define() ফাংশন ব্যবহার করে আপনি আপনার মডিউল তৈরি এবং রেজিস্টার করতে পারেন। এটি একটি মডিউল তৈরি করার জন্য ব্যবহৃত হয় এবং ডিপেনডেন্সি (dependencies) নির্দেশ করতে পারে।
উদাহরণ:
// module1.js
define([], function() {
return {
sayHello: function() {
return 'Hello from module1!';
}
};
});
এখানে, module1 একটি সহজ মডিউল যা sayHello ফাংশন প্রদান করে। define() এর প্রথম আর্গুমেন্ট হল মডিউলের ডিপেনডেন্সি (এখানে কোন ডিপেনডেন্সি নেই, তাই এটি একটি খালি অ্যারে), এবং দ্বিতীয় আর্গুমেন্ট হল মডিউলের ফ্যাক্টরি ফাংশন যা মডিউলের এক্সপোর্টযোগ্য মান প্রদান করে।
৩. ডিপেনডেন্সি ম্যানেজমেন্ট
RequireJS এর সাহায্যে আপনি মডিউলগুলির ডিপেনডেন্সি ম্যানেজ করতে পারেন। যদি একটি মডিউল অন্য মডিউলের উপর নির্ভরশীল হয়, তাহলে সেই মডিউলটিকে ডিপেনডেন্সি হিসেবে রেজিস্টার করতে হবে।
উদাহরণ:
// module2.js
define(['module1'], function(module1) {
return {
sayGoodbye: function() {
return 'Goodbye from module2! ' + module1.sayHello();
}
};
});
এখানে, module2 একটি নির্ভরশীল মডিউল module1 এর উপর এবং define() ফাংশনের প্রথম আর্গুমেন্টে module1 কে ডিপেনডেন্সি হিসেবে অন্তর্ভুক্ত করা হয়েছে। এর ফলে, module1 এর sayHello ফাংশনকে module2 তে ব্যবহার করা যেতে পারে।
৪. সিঙ্গেল মডিউল লোডিং
একটি নির্দিষ্ট মডিউল লোড করার জন্য আপনি require() ফাংশনটি ব্যবহার করতে পারেন। যদি শুধুমাত্র একটি নির্দিষ্ট মডিউল লোড করতে চান, তবে আপনাকে তার নাম সরাসরি পাস করতে হবে।
উদাহরণ:
require(['module1'], function(module1) {
console.log(module1.sayHello());
});
এখানে, module1 মডিউলটি লোড হবে এবং তার sayHello ফাংশন কল করা হবে।
৫. মাল্টিপল মডিউল লোডিং
একাধিক মডিউল একসঙ্গে লোড করতে, require() ফাংশনে তাদের নাম একটি অ্যারে আকারে পাঠাতে হবে। RequireJS এই মডিউলগুলিকে অ্যাসিঙ্ক্রোনাসভাবে লোড করবে।
উদাহরণ:
require(['module1', 'module2', 'module3'], function(module1, module2, module3) {
console.log(module1.sayHello());
console.log(module2.sayGoodbye());
console.log(module3.sayHi());
});
এখানে, তিনটি মডিউল (module1, module2, module3) একযোগে লোড হচ্ছে এবং যখন সব মডিউল লোড হবে, তখন তাদের প্রাসঙ্গিক ফাংশনগুলি কল করা হবে।
6. মডিউল ফাইলের পাথ কনফিগারেশন
RequireJS-এ require.config() এর মাধ্যমে মডিউল ফাইলের পাথ কনফিগার করা যায়। এটি আপনাকে নির্দিষ্ট ফোল্ডার বা পাথ থেকে মডিউলগুলি লোড করতে সাহায্য করে।
উদাহরণ:
require.config({
paths: {
'module1': 'libs/module1',
'module2': 'libs/module2'
}
});
require(['module1', 'module2'], function(module1, module2) {
console.log(module1.sayHello());
console.log(module2.sayGoodbye());
});
এখানে, paths এর মাধ্যমে মডিউল ফাইলের অবস্থান কনফিগার করা হয়েছে, যাতে RequireJS সেই ফাইলগুলি সঠিকভাবে লোড করতে পারে।
7. Shim ব্যবহার করা (Non-AMD Libraries)
কিছু লাইব্রেরি যেমন jQuery, Backbone.js বা Underscore.js AMD স্ট্যান্ডার্ড অনুসরণ করে না। এর জন্য shim কনফিগারেশন ব্যবহার করা হয়, যা ডিপেনডেন্সি ম্যানেজমেন্টের জন্য সহায়ক।
উদাহরণ:
require.config({
paths: {
'jquery': 'libs/jquery.min',
'backbone': 'libs/backbone.min'
},
shim: {
'backbone': {
deps: ['jquery'],
exports: 'Backbone'
}
}
});
require(['backbone'], function(Backbone) {
console.log(Backbone);
});
এখানে, backbone মডিউলটি jquery এর উপর নির্ভরশীল, এবং shim কনফিগারেশনটি Backbone.js লাইব্রেরির ডিপেনডেন্সি এবং এক্সপোর্ট কনফিগার করেছে।
সারাংশ
RequireJS মডিউল লোড করার জন্য বিভিন্ন পদ্ধতি সরবরাহ করে, যেমন:
require()ফাংশন ব্যবহার করে একাধিক মডিউল অ্যাসিঙ্ক্রোনাসভাবে লোড করা।define()ফাংশন ব্যবহার করে মডিউল তৈরি এবং রেজিস্টার করা।- ডিপেনডেন্সি ম্যানেজমেন্ট এবং পাথ কনফিগারেশন।
shimকনফিগারেশন ব্যবহার করে non-AMD লাইব্রেরি লোড করা।
RequireJS ব্যবহার করে আপনার JavaScript কোড মডুলার এবং রক্ষণাবেক্ষণযোগ্য করা সহজ হয়ে ওঠে।
Read more