टाइपस्क्रिप्ट / एंगुलर 2 में इंटरफेस और मॉडल का उपयोग कब करें

197

मैंने हाल ही में टाइपस्क्रिप्ट के साथ कोणीय 2 पर एक ट्यूटोरियल देखा, लेकिन एक इंटरफ़ेस का उपयोग करने के लिए और डेटा संरचनाओं को रखने के लिए एक मॉडल का उपयोग करने के लिए अनिश्चित।

इंटरफ़ेस का उदाहरण:

export interface IProduct {
    ProductNumber: number;
    ProductName: string;
    ProductDescription: string;
}

मॉडल का उदाहरण:

export class Product {
    constructor(
        public ProductNumber: number,
        public ProductName: string,
        public ProductDescription: string
    ){}
}

मैं JSON डेटा को URL से लोड करना चाहता हूं और इंटरफ़ेस / मॉडल से बांधना चाहता हूं। कभी-कभी मैं एक एकल डेटा ऑब्जेक्ट चाहता हूं, दूसरी बार मैं ऑब्जेक्ट को पकड़ना और सरणी करना चाहता हूं।

मुझे किसका उपयोग करना चाहिए और क्यों?

angular typescript

— I_LIKE_FOO
स्रोत

13

कस्टम तर्क init की जरूरत है जब एक वर्ग का उपयोग करें, अन्यथा हमेशा एक इंटरफ़ेस का उपयोग करें क्योंकि यह केवल संकलन समय पर उपलब्ध है। एक जावास्क्रिप्ट इंटरफ़ेस जावास्क्रिप्ट के लिए संकलित नहीं किया गया है क्योंकि यह जावास्क्रिप्ट में मौजूद नहीं है।

— डिटर्जेंट

6

ध्यान रखें कि इंटरफेस 2 में निर्भरता इंजेक्शन के साथ काम नहीं करेगा। यहां आपको कक्षाओं का उपयोग करना होगा।

— jangang

137

संकलन समय पर ही होते हैं। यह केवल आपको यह जांचने की अनुमति देता है कि प्राप्त अपेक्षित डेटा किसी विशेष संरचना का अनुसरण करता है। इसके लिए आप अपनी सामग्री को इस इंटरफ़ेस में डाल सकते हैं:

this.http.get('...')
    .map(res => <Product[]>res.json());

ये प्रश्न देखें:

आप क्लास के साथ भी कुछ ऐसा कर सकते हैं लेकिन क्लास के साथ मुख्य अंतर यह है कि वे रनटाइम (कंस्ट्रक्टर फंक्शन) में मौजूद होते हैं और आप प्रोसेसिंग के साथ उनमें तरीकों को परिभाषित कर सकते हैं। लेकिन, इस मामले में, आपको वस्तुओं का उपयोग करने में सक्षम होने की जरूरत है।

this.http.get('...')
    .map(res => {
      var data = res.json();
      return data.map(d => {
        return new Product(d.productNumber,
          d.productName, d.productDescription);
      });
    });

— थियरी टेम्पलियर
स्रोत

27

आपके विस्तृत उत्तर के लिए धन्यवाद। यदि इंटरफ़ेस केवल संकलन समय पर उपयोग किया जाता है, तो कंपाइलर वास्तव में http प्राप्त किए बिना JSON फ़ाइल की संरचना की जांच कैसे कर सकता है? अगर यह नहीं हो सकता है, तो एक इंटरफेस के साथ भी परेशान होने की क्या बात है?

— I_LIKE_FOO

7

@I_LIKE_FOO संकलनकर्ता को कॉल प्राप्त करने की जांच करने की आवश्यकता नहीं है। यह केवल उन प्रकारों की जाँच करने के बारे में परवाह करता है जिनके बारे में यह जानता है कि वे सही ढंग से संरेखित हैं। संकलक के लिए var data = res.json();वास्तव में var data: any = res.json();है इसलिए हम सभी प्रकार की जाँच को खो देते हैं data। यहाँ क्या अधिक उपयोगी होगा एक इंटरफ़ेस होने के var data: ProductDto[] = res.json();साथ कुछ ऐसा होगा ProductDtoजो लौटे हुए json में डेटा संरचना को मॉडल करता है।

— GFoley83

3

अधिक: Angular style guide says not to use interfaces.Always use classes.देखें angular.io/guide/styleguide#style-03-03

— संपत

4

हां, लेकिन समस्या यह है कि वे गुरु देवता नहीं हैं जो टाइपस्क्रिप्ट इंजीनियर हैं। यह Microsoft और कंपनी होगी। वे उपयुक्त होने पर इंटरफेस, और वर्गों का पक्ष लेते हैं। इसके अलावा बोनस अंक ... एक रनटाइम है और अन्य संकलन समय पर है

— टॉम स्टिकेल

11

@ संपत शायद कोणीय शैली गाइड को अपडेट कर दिया गया है क्योंकि मैं अब इसे "डेटा मॉडल के लिए इंटरफ़ेस का उपयोग करने पर विचार करता हूं।" इंप्लाइज डेटा मॉडल के लिए क्लास के ऊपर इंटरफेस पसंद करते हैं।

— मिकज़्क्स 6r

40

इंटरफ़ेस या तो एक के लिए एक अनुबंध का वर्णन वर्ग या एक नया प्रकार । यह एक शुद्ध टाइपस्क्रिप्ट तत्व है, इसलिए यह जावास्क्रिप्ट को प्रभावित नहीं करता है।

एक मॉडल, और अर्थात् एक वर्ग , एक वास्तविक जेएस फ़ंक्शन है जिसका उपयोग नई वस्तुओं को उत्पन्न करने के लिए किया जा रहा है।

मैं JSON डेटा को URL से लोड करना चाहता हूं और इंटरफ़ेस / मॉडल से बांधना चाहता हूं।

एक मॉडल के लिए जाएं, अन्यथा यह अभी भी आपकी जावास्क्रिप्ट में JSON होगा।

— pietro909
स्रोत

4

जैसा कि @ThierryTemplier ने सर्वर से डेटा प्राप्त करने के लिए और घटकों के बीच मॉडल को प्रसारित करने के लिए भी कहा (अंतर्मुखी सूची रखने और डिजाइन समय त्रुटि बनाने के लिए), यह इंटरफ़ेस का उपयोग करने के लिए ठीक है, लेकिन मुझे लगता है कि सर्वर (डीटीओ) को डेटा भेजने के लिए कक्षा लेने के लिए उपयोग करना बेहतर है। मॉडल से ऑटो मैपिंग डीटीओ के फायदे।

— M_Farahmand
स्रोत

-22

इंटरफ़ेस के बजाय कक्षा का उपयोग करें जो मैंने अपने सभी शोध के बाद खोजा है।

क्यों? क्लास-प्लस-इंटरफ़ेस की तुलना में अकेले एक क्लास कम कोड है। (वैसे भी आपको डेटा मॉडल के लिए क्लास की आवश्यकता हो सकती है)

क्यों? एक वर्ग एक इंटरफ़ेस के रूप में कार्य कर सकता है (एक्सटेंड्स के बजाय इम्प्लीमेंट का उपयोग करें)।

क्यों? एक इंटरफ़ेस-क्लास एक प्रदाता लुकअप टोकन है जो कोणीय निर्भरता इंजेक्शन में हो सकता है।

कोणीय शैली गाइड से

मूल रूप से एक क्लास सभी कर सकते हैं, एक इंटरफ़ेस क्या करेगा। तो कभी भी इंटरफ़ेस का उपयोग करने की आवश्यकता नहीं हो सकती है ।

— सजथ मंथरथ
स्रोत

10

कोणीय शैली गाइड वर्तमान में वास्तव में कहता है, “ डेटा मॉडल के लिए एक इंटरफ़ेस का उपयोग करने पर विचार करें । "

— एलेक्स पीटर्स

@AlexPeters कृपया कोई प्रामाणिक लिंक प्रदान करें। अग्रिम धन्यवाद

— आनंद फड़के

@AnandPhadke यकीन है, यहाँ ऊपर टिप्पणी के समय से कोणीय शैली गाइड के लिए एक Wayback मशीन लिंक है।

— एलेक्स पीटर्स