मेरमाइड.जीएस स्टेट डायग्राम सिंटैक्स गाइड

एक स्टेट डायग्राम क्या है?

एक स्टेट डायग्राम (जिसे स्टेटचार्ट के रूप में भी जाना जाता है) एक व्यवहारात्मक यूएमएल डायग्राम जो एक वस्तु या उपप्रणाली के सीमित जीवनचक्र को मॉडल करता है। एक मूल यूएमएल डायग्राम प्रकार यह एक एकांत अवस्था (स्टेट्स) के अलग-अलग शर्तों को दर्शाता है जिनमें एक एकांत रह सकता है, बाहरी घटनाओं या ट्रिगर्स जो उन शर्तों के बीच स्थानांतरण को बल देते हैं (ट्रांजीशन), और निर्भरता नियम शाखाएं जो कार्यान्वयन मार्गों को बदलती हैं। इस मैपिंग को जटिल वस्तु जीवनचक्र के ट्रैकिंग के लिए आवश्यक है, जैसे एक आदेश का पूर्णता से डिलीवरी तक प्रगति, एक उपयोगकर्ता सत्र समय समाप्ति अनुक्रम, या एक एम्बेडेड हार्डवेयर स्विच लूप।

साथ में मेरमाइड.जीएस आप एक घोषणात्मक, पाठ-आधारित स्कीमा का उपयोग करके अपनी प्रतिक्रियाशील स्टेट मशीनों को परिभाषित कर सकते हैं। पार्सिंग इंजन स्वचालित रूप से आदर्श लेआउट स्पेसिंग की गणना करता है, रिकर्सिव लूपिंग तीरों को संभालता है, और स्टेट कंटेनर सीमाओं को चिकने तरीके से स्केल करता है।

मूल सिंटैक्स गाइड: तत्व और निर्माण

मेरमाइड में एक सटीक, मानक-अनुपालन युक्त यूएमएल स्टेट डायग्राम डिज़ाइन करने के लिए, आपको एंट्री/एग्ज़िट मार्कर्स, ट्रांजीशन स्ट्रिंग्स, कॉम्पोजिट नेस्टिंग और शर्तीय चयन ब्लॉक्स को समझना होगा।

1. एंट्री, एग्ज़िट और मानक स्टेट्स को परिभाषित करना

आप पहली पंक्ति पर stateDiagram-v2 कीवर्ड का उपयोग करके स्टेट कैनवास को शुरू करते हैं। जीवनचक्र के स्पष्ट शुरुआती और समाप्ति बिंदुओं की आवश्यकता होती है, जिन्हें एक ठोस वृत्त प्रतीक ([*]):

• प्रारंभिक अवस्था (एंट्री): [*] --> स्टेटनाम (जहां जीवनचक्र शुरू होता है)।
• अंतिम अवस्था (एग्ज़िट): स्टेटनाम --> [*] (जहां जीवनचक्र समाप्त होता है)।

stateDiagram-v2
    [*] --> आइडल
    आइडल --> [*]

2. संक्रमण ट्रिगर और इवेंट लेबल को कॉन्फ़िगर करना

एक स्थिति परिवर्तन को मैप करने के लिए, अपने परिभाषित स्थिति टोकन को मानक तीर रेखा का उपयोग करके जोड़ें (-->). इस संक्रमण के कारण बनने वाली सटीक घटना, API प्रतिक्रिया या बटन क्लिक को दस्तावेज़ करने के लिए, एक दांते चिह्न (:) के बाद अपनी वर्णनात्मक पाठ स्ट्रिंग जोड़ें:

stateDiagram-v2
    सक्रिय --> निलंबित : भुगतानविफल
    निलंबित --> सक्रिय : बिलनिपटाया

3. शर्तीय चयन ब्लॉक कार्यान्वयन

शाखाओं वाले मूल्यांकन लूप को संभालने के लिए, उपयोग करें <<चयन>> स्टेरियोटाइप। यह कैनवास पर एक स्पष्ट हीरे के आकार को बनाता है जो एकल इनबाउंड संक्रमण पथ को रनटाइम तर्क जांच के आधार पर कई अलग-अलग आउटबाउंड पथ में विभाजित करता है:

stateDiagram-v2
    state जांच_स्थिति <<चयन>>
    [*] --> जांच_स्थिति
    जांच_स्थिति --> प्रीमियम_उपयोगकर्ता : यदि बैलेंस >= 100
    जांच_स्थिति --> स्टैंडर्ड_उपयोगकर्ता : यदि बैलेंस < 100

4. संयुक्त (नेस्टेड) स्थितियों की संरचना

जब एक जटिल प्रणाली का मॉडलिंग कर रहे हों, तो एक एकल उच्च स्तर की स्थिति अपने स्वतंत्र आंतरिक जीवनचक्र को समाहित कर सकती है। आप एक मातृ स्थिति को परिभाषित करके और ब्रेसेज़ में लपेटे गए बॉडी ब्लॉक के बाद एक नेस्टेड उप-स्थिति लेआउट बना सकते हैं:

stateDiagram-v2
    state ऑर्डर_प्रोसेसिंग {
        [*] --> पैकेजिंग
        पैकेजिंग --> लेबलिंग
    }

स्पष्ट स्थिति मशीन लेआउट के लिए सर्वोत्तम प्रथाएं

• स्थिति टोकन छोटे रखें: अपने आंतरिक स्थिति टोकन के लिए संक्षिप्त कैमलकेस पाठ स्ट्रिंग का उपयोग करें (उदाहरण के लिए, रिफंड का इंतजार)। यदि आपको कैनवास पर लंबा वर्णनात्मक शीर्षक चाहिए, तो उपयोग करें स्थिति "वर्णनात्मक पाठ ब्लॉक" टोकन के रूप में एक स्पष्ट एलियास बनाने के लिए सिंटैक्स।
• एकल प्रवेश बिंदु को लागू करें: हमेशा अपने आरेख को एकल से शुरू करें[*] नोड। एक से अधिक प्रारंभिक बिंदु होने से उन उपयोगकर्ताओं को भ्रमित कर सकता है जो प्रणाली के मूल प्रारंभिक मार्ग का अनुसरण करने की कोशिश कर रहे हैं।
• हमेशा stateDiagram-v2 का उपयोग करें: हमेशा चुनेंstateDiagram-v2 कीवर्ड लीगेसी के बजायstateDiagram फ्लैग। v2 रेंडरिंग इंजन एक अद्यतन लेआउट एल्गोरिदम का उपयोग करता है जो साफ लाइन रूटिंग और बेहतर नेस्टेड बॉक्स अनुरूपता प्रदान करता है।

वास्तविक दुनिया के Mermaid.js स्थिति आरेख उदाहरण

उदाहरण 1: डिजिटल वॉलेट लेनदेन जीवनचक्र (चयन शाखाएँ और विफलता लूप)

यह कार्यात्मक ब्लूप्रिंट एक डिजिटल भुगतान लेनदेन के जीवनचक्र को मॉडल करता है, दिखाता है कि लेनदेन प्रारंभिक जमा बिंदु से फ्रॉड चेक शाखा के माध्यम से अंतिम लेजर अवस्थाओं में कैसे आगे बढ़ता है।

stateDiagram-v2
    राज्य fraud_check <<choice>>

    [*] --> TransSubmitted
    TransSubmitted --> fraud_check : ExecuteRiskAssessment

    fraud_check --> TransApproved : रिस्क स्कोर कम
    fraud_check --> TransFlagged : रिस्क स्कोर बढ़ा हुआ
    
    TransFlagged --> TransApproved : मैनुअल मैनेजर ओवरराइड
    TransFlagged --> TransDeclined : सुरक्षा समय सीमा समाप्त
    
    TransApproved --> SettlementPending : लेजर में निर्णय लें
    SettlementPending --> TransCompleted : बैंक सेटलमेंट सफल
    
    TransDeclined --> [*]
    TransCompleted --> [*]

सिंटैक्स विश्लेषण: इस वर्कफ्लो का उपयोग करता है<<choice>> ब्लॉक सुरक्षा स्कोर के मूल्यांकन के लिए शुरू में उपयोग करता है। लेनदेन इन स्कोर के आधार पर अलग-अलग मार्गों के साथ संक्रमण करता है, स्पष्ट इवेंट नामों (जैसेExecuteRiskAssessment) संक्रमण तीरों पर सीधे दर्ज किए गए हैं।

उदाहरण 2: ई-कॉमर्स ऑर्डर फुलफिलमेंट पाइपलाइन (संयुक्त नेस्टेड प्रणालियाँ)

यह उन्नत उद्यम ब्लूप्रिंट एक पूर्ण शिपिंग और ऑर्डर प्रबंधन जीवनचक्र का वर्णन करता है, फुलफिलमेंट चरण के भीतर हो रही आंतरिक संचालन को दिखाने के लिए नेस्टेड संयुक्त ब्लॉक का उपयोग करता है।

stateDiagram-v2
    [*] --> OrderPlaced
    
    OrderPlaced --> InFulfillment : PaymentCaptured
    
    राज्य InFulfillment {
        [*] --> ItemPicking
        ItemPicking --> QualityAudit : BatchPicked
        QualityAudit --> SecureBoxPacking : AuditPassed
        SecureBoxPacking --> CarrierManifest Generated : LabelPrinted
    }
    
    InFulfillment --> Shipped : CarrierHandshake
    Shipped --> Delivered : OutForDeliveryConfirmed
    
    Delivered --> [*]

वाक्य विश्लेषण: चरणों को अंदर लपेटकर state InFulfillment {...} बॉडी ब्लॉक, आप कैनवास पर स्पष्ट संरचनात्मक सीमा बनाते हैं। इंजन इस ब्लॉक को एकल संगठित मुख्य अवस्था के रूप में मानता है जब इसके आंतरिक कार्यप्रवाह चरणों को क्रमिक रूप से रेंडर करता है, जिससे जटिल बहु-स्तरीय जीवनचक्र को आसानी से नेविगेट करना संभव होता है।