jQuery में document.ready के बाहर ग्लोबल वेरिएबल कैसे बनाएं?

जावास्क्रिप्ट में ग्लोबल वेरिएबल बनाने के लिए <script> टैग में फंक्शन के बाहर वेरिएबल घोषित करें। $(document).ready() के अंदर मान असाइन करें।

बुनियादी पैटर्न

<script>
    // 1. ग्लोबल स्कोप में घोषित करें (window प्रॉपर्टी बन जाती है)
    var globalVariable;

    $(document).ready(function() {
        // 2. DOM तैयार होने पर मान असाइन करें
        function initializeGlobalVariable() {
            globalVariable = [{
                "name": "John",
                "age": 23
            }];
        }
        initializeGlobalVariable();
    });

    // 3. कहीं भी उपयोग करें (ready के बाहर भी)
    function createGlobalVariable() {
        if (globalVariable && globalVariable.length) {
            console.log('नाम: ' + globalVariable[0].name);
            console.log('आयु: ' + globalVariable[0].age);
        }
    }
</script>

पूरा HTML उदाहरण

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>ग्लोबल वेरिएबल</title>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
    <button onclick="createGlobalVariable()">ग्लोबल वेरिएबल दिखाएं</button>

    <script>
        // ग्लोबल स्कोप
        let globalData = null;

        $(document).ready(function() {
            // DOM तैयार होने पर डेटा इनिशियलाइज़ करें
            globalData = {
                user: "John",
                role: "admin",
                permissions: ["read", "write", "delete"]
            };
            console.log("ग्लोबल डेटा इनिशियलाइज़्ड");
        });

        // ग्लोबल फंक्शन - कहीं से भी कॉल करने योग्य
        window.createGlobalVariable = function() {
            if (globalData) {
                alert(`उपयोगकर्ता: ${globalData.user}\nभूमिका: ${globalData.role}`);
                console.log(globalData);
            } else {
                alert("डेटा अभी लोड नहीं हुआ!");
            }
        };
    </script>
</body>
</html>

मॉडर्न ES6+ दृष्टिकोण (jQuery के बिना)

<script>
    // मॉड्यूल पैटर्न - ग्लोबल नेमस्पेस प्रदूषण से बचें
    const App = (function() {
        let globalData = null; // प्राइवेट
        
        function init() {
            globalData = { user: "John", role: "admin" };
        }
        
        function getData() {
            return globalData;
        }
        
        return { init, getData };
    })();

    // DOMContentLoaded पर इनिशियलाइज़
    document.addEventListener('DOMContentLoaded', App.init);

    // उपयोग
    window.showData = () => console.log(App.getData());
</script>

बेस्ट प्रैक्टिस

• ग्लोबल नेमस्पेस ऑब्जेक्ट बनाएं: window.MyApp = {}
• var के बजाय let/const उपयोग करें
• IIFE या मॉड्यूल पैटर्न से एनकैप्सुलेट करें
• ES मॉड्यूल (type="module") उपयोग करें - ग्लोबल स्कोप स्वतः अलग

चलाने का तरीका

फ़ाइल को global-variable.html नाम से सेव करें और ब्राउज़र में खोलें।