React Academy · पाठ

useReducer की बुनियाद और ऐक्शन के तरीके

useReducer सीखें: स्टेट + reducer(state, action) → अगला स्टेट। कई फ़ील्ड के अपडेट सँभालने के लिए स्पष्ट ऐक्शन (type, payload) का उपयोग करें।

पाठ 2, कुल 3 में से8 चरण

useReducer की बुनियाद और ऐक्शन के तरीके, CoddyKit पर React Academy का एक निःशुल्क पाठ है। यह 3 में से 2वाँ पाठ है। आप नीचे पूरा पाठ निःशुल्क पढ़ सकते हैं—फिर अंतर्निहित कोड संपादक और 24/7 एआई ट्यूटर के साथ ब्राउज़र में इसका व्यावहारिक अभ्यास कर सकते हैं। यह React Academy सीखने के मार्ग का हिस्सा है और आपकी प्रगति वेब तथा CoddyKit ऐप पर सिंक होती रहती है। React Academy पाठ्यक्रम में कुल 3 पाठ शामिल हैं।

useReducer क्यों?

लक्ष्य: अपडेट्स को एक रिड्यूसर फ़ंक्शन से प्रबंधित करने के लिए useReducer का उपयोग करें। यह तब उपयोगी होता है जब कई फ़ील्ड एक साथ बदलते हैं।

  • स्टेट ऑब्जेक्ट
  • ऐक्शन: प्रकार + पेलोड
  • शुद्ध रिड्यूसर(स्टेट, ऐक्शन)

रिड्यूसर की रचना

रिड्यूसर वर्तमान स्टेट और एक ऐक्शन लेता है तथा अगला स्टेट लौटाता है। इसे शुद्ध रखें, यानी इसमें साइड इफ़ेक्ट न हों। INCREMENT, RESET या फ़ील्ड_अपडेट जैसे छोटे ऐक्शन प्रकारों का उपयोग करें।

डेमो: useReducer से काउंटर

एक छोटा काउंटर useReducer का उपयोग करके स्टेट → ऐक्शन → अगला स्टेट चक्र दिखाता है।


<div id="root"></div>

ऐक्शन के पैटर्न

ऐक्शन्स को सरल रखें:

  • प्रकार: एक छोटा क्रिया-शब्द, जैसे फ़ील्ड_अपडेट
  • पेलोड: आवश्यक डेटा
  • टाइपो से बचने के लिए वैकल्पिक छोटे ऐक्शन बनाने वाले फ़ंक्शन

डेमो: रिड्यूसर वाला फ़ॉर्म

एक फ़ॉर्म रिड्यूसर एक ही फ़ील्ड_अपडेट ऐक्शन से कई फ़ील्ड संभालता है। सभी अपडेट्स का नियंत्रण एक ही जगह पर रहता है।


<div id="root"></div>

सुझाव और सावधानियाँ

सुझाव:

  • रिड्यूसर्स को शुद्ध और छोटा रखें।
  • संबंधित फ़ील्ड्स को एक स्टेट ऑब्जेक्ट में समूहित करें।
  • ऐक्शन के नाम स्पष्ट रखें; बहुत-से मिलते-जुलते मामलों से बचें।

useReducer चुनने की जाँच

कई useState कॉल्स के बजाय आम तौर पर useReducer को कब प्राथमिकता दी जाती है?

पुनरावलोकन

पुनरावलोकन: एक शुद्ध रिड्यूसर परिभाषित करें, सरल ऐक्शन्स डिस्पैच करें और कई फ़ील्ड्स के अपडेट्स को एक ही जगह प्रबंधित करें। जब कई मान एक साथ बदलें, तब useReducer चुनें।

शुरुआत निःशुल्क

एआई शिक्षक के साथ React सीखें — निःशुल्क

अपने ब्राउज़र में वास्तविक कोड लिखें और चलाएँ, चौबीसों घंटे एआई शिक्षक से तुरंत सहायता पाएँ, और वेब या ऐप पर वहीं से शुरू करें जहाँ आपने छोड़ा था।

पाठ्यक्रम
88
पाठ
324

अक्सर पूछे जाने वाले प्रश्न

क्या “useReducer की बुनियाद और ऐक्शन के तरीके” पाठ निःशुल्क है?

हाँ—“useReducer की बुनियाद और ऐक्शन के तरीके” का पूरा पाठ यहाँ वेब पर निःशुल्क पढ़ा जा सकता है। इंटरैक्टिव अभ्यास (अंतर्निहित कोड संपादक और 24/7 एआई ट्यूटर) करने और React Academy पाठ्यक्रम का बाकी हिस्सा अनलॉक करने के लिए CoddyKit PRO लें। React Academy पाठ्यक्रम में कुल 3 पाठ शामिल हैं।

“useReducer की बुनियाद और ऐक्शन के तरीके” में मैं क्या सीखूँगा?

useReducer सीखें: स्टेट + reducer(state, action) → अगला स्टेट। कई फ़ील्ड के अपडेट सँभालने के लिए स्पष्ट ऐक्शन (type, payload) का उपयोग करें। आप ब्राउज़र में सीधे चलाए जाने वाले व्यावहारिक कोड के साथ React Academy का अभ्यास करते हैं, और पाठ पूरा करते समय 24/7 एआई ट्यूटर आपके प्रश्नों के उत्तर देता है।

क्या React Academy शुरू करने के लिए मुझे किसी अनुभव की आवश्यकता है?

पहले के अनुभव की आवश्यकता नहीं है। CoddyKit पर React Academy शुरुआती से लेकर उन्नत शिक्षार्थियों तक सभी के लिए व्यवस्थित किया गया है, इसलिए आप यहीं से या शुरुआत से सीखना शुरू कर सकते हैं और अपनी गति से आगे बढ़ सकते हैं। यह 3 में से 2वाँ पाठ है।

“useReducer की बुनियाद और ऐक्शन के तरीके” पाठ पूरा करने में कितना समय लगता है?

CoddyKit का अधिकांश पाठ लगभग 5–10 मिनट में पूरा हो जाता है। हर पाठ छोटा और संवादात्मक है, इसलिए आप लगातार प्रगति करते हैं और वेब या ऐप पर वहीं से सीखना जारी रख सकते हैं जहाँ आपने छोड़ा था।

क्या मैं इस React Academy पाठ में कोड लिख और चला सकता हूँ?

हाँ। हर React Academy पाठ में एक अंतर्निर्मित कोड संपादक शामिल है, जिससे आप सीधे अपने ब्राउज़र में वास्तविक कोड लिख और चला सकते हैं और तुरंत एआई प्रतिक्रिया पा सकते हैं—स्थानीय सेटअप की आवश्यकता नहीं है।

इस पाठ्यक्रम के सभी पाठ

  1. कॉन्टेक्स्ट की बुनियाद और प्रॉप ड्रिलिंग से बचाव
  2. useReducer की बुनियाद और ऐक्शन के तरीके
  3. कॉन्टेक्स्ट + रिड्यूसर: सरल स्टेट कंटेनर
← React Academy पर वापस जाएँ