JavaScript से URL के सभी डेटा वैल्यूज़ कैसे प्राप्त करें

JavaScript के URL कंस्ट्रक्टर मेथड का उपयोग करके URL से सभी डेटा वैल्यूज़ प्राप्त करना सीखें।

मान लीजिए आप अपनी वेबसाइट पर किसी प्रकार का आंतरिक सर्च फंक्शन बना रहे हैं। इसे ठीक से करने के लिए आपको एक URL स्ट्रिंग के सभी डेटा वैल्यूज़ तक पहुंचने की आवश्यकता है।

सौभाग्य से, JavaScript में new URL() नामक एक कंस्ट्रक्टर मेथड है जो हमें एक URL को ऑब्जेक्ट में बदलने की अनुमति देता है जो हमें URLs में हर प्रॉपर्टी और वैल्यू का एक अच्छी तरह से व्यवस्थित अवलोकन देता है।

इसका उपयोग करने के लिए, एक वेरिएबल बनाएं, और इसे new URL('your-url') का वैल्यू असाइन करें। उदाहरण के लिए, नीचे मैं TechStacker के एक आर्टिकल के URL के आधार पर एक URL ऑब्जेक्ट बना रहा हूं:

const urlData = new URL('https://techstacker.com/how-to-detect-double-clicks-with-vanilla-javascript');

अब परिणाम को लॉग आउट करने का प्रयास करें:

console.log(urlData)

आपका रिटर्न किया गया URL ऑब्जेक्ट इससे मिलता-जुलता दिखेगा:

var url = { 
  hash: "", 
  host: "techstacker.com", 
  hostname: "techstacker.com", 
  href: "https://techstacker.com/,how-to-detect-double-clicks-with-vanilla-javascript", 
  origin: "https://techstacker.com", 
  password: "", 
  pathname: "/how-to-detect-double-clicks-with-vanilla-javascript", 
  port: "", 
  protocol: "https:", 
  search: "", 
  searchParams: "URLSearchParams {}", 
  username: "" 
};

और अब आप आसानी से प्रत्येक प्रॉपर्टी तक पहुंच सकते हैं और जो चाहें कर सकते हैं। उदाहरण के लिए, अपने URL के pathname तक पहुंच प्राप्त करने के लिए, आप यह करेंगे:

console.log(url.pathname) // Prints: "/how-to-detect-double-clicks-with-vanilla-javascript"