খুব সুন্দর প্রশ্ন! এই প্রশ্নটা একদম “ভিতর থেকে জানার” প্রশ্ন — এবং এইটা জাভাস্ক্রিপ্ট শেখার পাকা ধরন।
চলো সহজভাবে, ভাইয়ের মতো করে বুঝিয়ে দিই:
🧠 navigator কোথা থেকে আসলো?
navigator হলো ব্রাউজার-এর ভিতরে থাকা একটি বিল্ট-ইন অবজেক্ট —
যেটা window অবজেক্টের একটি প্রপার্টি।
তুমি যদি ব্রাউজারে এইটা চালাও:
console.log(window.navigator);তাহলে ঠিক একই জিনিস পাবে যেটা console.log(navigator) দিলে পাচ্ছো।
কারণ 👉 navigator আসলে window.navigator এর শর্টফর্ম।
যখন আমরা ব্রাউজারে কোড চালাই, তখন JavaScript এর Global Scope-এ থাকা সব
windowএর ভেতরেই থাকে।
🧭 navigator আমাদের কী দেয়?
navigator ব্রাউজার সম্পর্কিত অনেক তথ্য দেয় — যেমন:
| কাজ | Property/Method | ব্যাখ্যা |
|---|---|---|
| লোকেশন বের করা | navigator.geolocation | ইউজারের অবস্থান (latitude/longitude) পাওয়া যায় |
| ব্রাউজার অনলাইন নাকি অফলাইন | navigator.onLine | true/false রিটার্ন করে |
| ইউজারের ডিভাইসের ভাষা | navigator.language | যেমন: 'en-US', 'bn-BD' |
| ইউজারের ব্রাউজার সম্পর্কে তথ্য | navigator.userAgent | যেমন: 'Mozilla/5.0 ... Chrome/114...' |
| ইউজার কোন প্ল্যাটফর্মে আছে | navigator.platform | যেমন: 'Win32', 'Linux', 'Android' |
| ইউজার যদি পিডব্লিউএ (PWA) অ্যাপে থাকে | navigator.standalone | true/false |
✅ ভবিষ্যতে navigator কবে লাগবে?
তুমি যদি ব্রাউজার ভিত্তিক ইউজার অভিজ্ঞতা তৈরি করো, তাহলে navigator অনেক কাজে আসবে।
উদাহরণ:
-
✅ লোকেশন দিয়ে Weather App বানানো →
navigator.geolocationদিয়ে ইউজারের লোকেশন জেনে API কল করো -
✅ অনলাইন/অফলাইন চেক করা → যদি
navigator.onLine === falseহয়, তুমি ইউজারকে বলে দিতে পারো:
"তুমি এখন অফলাইনে, ডেটা লোড হবে না!"
-
✅ ভাষা অনুযায়ী কনটেন্ট দেখানো → ধরো ইউজার যদি
navigator.language === 'bn-BD'হয়, তুমি বাংলা ভাষায় দেখাতে পারো। -
✅ UserAgent দেখে মোবাইল নাকি ডেস্কটপ চেক → তোমার UI মোবাইল হলে ভিন্নভাবে দেখাতে পারো
🔍 Debug করে দেখো (প্র্যাকটিস)
ব্রাউজারে Developer Console খুলে এইগুলো চালাও:
console.log(navigator);
console.log(navigator.geolocation);
console.log(navigator.onLine);
console.log(navigator.userAgent);
console.log(navigator.language);
console.log(navigator.platform);🎁 Bonus: navigator দিয়ে ইউজারকে ডাউনলোড করাও (advanced)
const isMobile = /Mobi/.test(navigator.userAgent);
if (isMobile) {
alert("তুমি মোবাইল দিয়ে ব্রাউজ করছো");
}🔚 সংক্ষেপে মনে রাখো:
navigatorহলোwindow.navigatorএর শর্টফর্ম- এটা ব্রাউজারের দেয়া অনেক তথ্য রাখে
- লোকেশন, অনলাইন স্টেটাস, ইউজার ভাষা — এসব পাওয়া যায়
- Weather App, Language-based App, Offline Mode এসব করতে কাজে লাগে
অবশ্যই ভাই! নিচে আমি সংক্ষেপে, ঝরঝরে ভাবে navigator API-এর সবগুলো দরকারি ফিচার একসাথে টেবিল আকারে দিয়ে দিলাম — দেখে-দেখে তুমি দ্রুত বুঝতে ও ব্যবহার করতে পারবে।
✅ navigator চিটশীট (সংক্ষিপ্ত টেবিল)
| কাজের ধরন 🔧 | navigator প্রপার্টি 🧩 | উদাহরণ 🧪 | ফলাফল 🎯 |
|---|---|---|---|
| ইউজারের লোকেশন জানা | navigator.geolocation | .getCurrentPosition(...) | ল্যাটিচিউড, লংগিচিউড |
| ইউজার অনলাইনে কিনা | navigator.onLine | navigator.onLine | true / false |
| ইউজারের ভাষা জানার জন্য | navigator.language | navigator.language | 'en-US', 'bn-BD' ইত্যাদি |
| প্ল্যাটফর্ম (OS) জানা | navigator.platform | navigator.platform | 'Win32', 'Android' ইত্যাদি |
| মোবাইল/ডেস্কটপ চেক | navigator.userAgent | /Mobi/.test(navigator.userAgent) | মোবাইল হলে true |
| কুকি চালু আছে কিনা | navigator.cookieEnabled | navigator.cookieEnabled | true / false |
| ব্রাউজার সম্পর্কে জানার জন্য | navigator.userAgent | navigator.userAgent | Chrome/Firefox/OS version info |
| ব্রাউজার স্ট্যান্ডঅলোন মোডে কিনা (PWA) | navigator.standalone | navigator.standalone | true / false (iOS only) |
⚡ উদাহরণ (মাত্র ৫ সেকেন্ডে চেক!)
console.log(navigator.geolocation); // লোকেশন API
console.log(navigator.onLine); // true/false
console.log(navigator.language); // ইউজারের ভাষা
console.log(navigator.platform); // OS info
console.log(navigator.userAgent); // ব্রাউজার info
console.log(navigator.cookieEnabled); // কুকি চালু কিনা