कन्स्ट्रक्टर बनाम राज्य = {} का उपयोग प्रतिक्रिया घटक में राज्य घोषित करने के बीच क्या अंतर है?

Question

मैंने पाया वहाँ दो तरह से की तरह नीचे

class App extends Component { 
    constructor(props) { 
     super(props); 
     this.state = { 
      name: 'John' 
     } 
    } 

    render() { 
     return <div>{this.state.name}</div> 
    } 

} 

और

class App extends Component { 
    state = { 
     name: 'John' 
    } 

    render() { 
     return <div>{this.state.name}</div> 
    } 

} 

इन दोनों के बीच क्या अंतर है वर्ग घटक में राज्य घोषित करने के लिए है?

Answer 1

वे लगभग बराबर हैं। महत्वपूर्ण अंतर यह है कि दूसरे उदाहरण में प्रारंभकर्ता constructor से पहले निष्पादित किया जाता है।

दूसरा दृष्टिकोण class fields प्रस्ताव का उपयोग करता है।

यह ईसीएमएस्क्रिप्ट मानक का हिस्सा नहीं है, इसलिए आपको दूसरे दृष्टिकोण का उपयोग करने के लिए सही ढंग से ट्रांसलेटर स्थापित करने की आवश्यकता है।

युपीडीBabel output पर एक नजर डालें बेहतर कैसे सार्वजनिक दृष्टांत काम फ़ील्ड को समझने के लिए।

Answer 2

निर्माता का उपयोग करें जब आप state

class App extends Component { 
    constructor(props){ 
    super(props); 
    this.state = { 
     name: 'John' 
    } 
    } 
} 

में props डेटा को बचाने के लिए नहीं तो आप सीधे सेट कर सकते हैं कठिन कोडित डेटा

class App extends Component { 
    state = { 
    name: 'John' 
    } 
} 

के लिए state चाहते