'विंडो' टाइपस्क्रिप्ट इंटरफ़ेस

Question

का विस्तार कैसे करें मेरे उदाहरण में, मैं fetch के लिए पॉलीफ़िल को शामिल करने के लिए टीएस विंडो इंटरफ़ेस को विस्तारित करने का प्रयास कर रहा हूं। कोई फर्क नहीं पड़ता। प्रश्न (iirc है "मैं टीएस कैसे बता कि window.fetch एक वैध समारोह है?"

मैं वी.एस. संहिता में यह कर रहा हूँ, v.0.3.0 जो टीएस v.1.5 चल रहा है)।

घोषित मेरी टीएस वर्ग फ़ाइल के अंदर इंटरफ़ेस जहां मैं इसे उपयोग करना चाहते हैं काम नहीं करता है:

///<reference path="typings/tsd.d.ts"/> 

interface Window { 
    fetch:(url: string, options?: {}) => Promise<any> 
} 
... 
window.fetch('/blah').then(...); // TS objects that window doesn't have fetch 

लेकिन यह ठीक है अगर मैं एक अलग ".d.ts" में इस एक ही इंटरफ़ेस घोषित फाइल करें और इसे मेरी टीएस क्लास फ़ाइल में संदर्भित करें।

///<reference path="typings/window.extend.d.ts"/> 
... 
window.fetch('/blah').then(...); // OK 

वैकल्पिक रूप से, मैं एक विस्तार इंटरफेस लिख सकते हैं:

यहाँ "typings/window.extend.d.ts"

///<reference path="es6-promise/es6-promise"/> 
interface Window { 
    fetch:(url: string, options?: {}) => Promise<any> 
} 

अब मैं अपने टीएस वर्ग फ़ाइल में इसका इस्तेमाल कर सकते हैं मेरी टीएस वर्ग फ़ाइल में एक और नाम साथ और फिर एक फिल्म में इसका इस्तेमाल करते हैं:

interface WindowX extends Window { 
    fetch:(url: string, options?: {}) => Promise<any> 
} 
... 
(<WindowX> window).fetch('/blah').then(...); // OK 

इंटरफ़ेस को "डी.टी.एस." में क्यों काम करता है लेकिन सीटू में क्यों नहीं?

क्या मुझे वास्तव में इन gyrations के माध्यम से जाना है?

Answer 1

जब आप एक शीर्ष स्तर import या export आपकी फ़ाइल में (जो आप कहीं इस समस्या हो रही किया जाना चाहिए) है, तो आपकी फ़ाइल एक बाहरी मॉड्यूल है।

बाहरी मॉड्यूल में, एक इंटरफ़ेस घोषित करना हमेशा एक मौजूदा वैश्विक इंटरफ़ेस को बढ़ाने के बजाय एक नया प्रकार बनाता है। यह मॉड्यूल लोडर के सामान्य व्यवहार की नकल करता है - कि इस फ़ाइल में घोषित चीजें वैश्विक दायरे में चीजों में विलय या हस्तक्षेप नहीं करती हैं।

इस गियरेशन का कारण यह है कि अन्यथा बाहरी मॉड्यूल में, नए चर या प्रकार को वैश्विक दायरे में समान नाम के साथ परिभाषित करने का कोई तरीका नहीं होगा।

Answer 2

आप declare global

declare global { 
    interface Window { 
    fetch:(url: string, options?: {}) => Promise<any> 
    } 
} 

जरूरत है यह तो काम करता है:

window.fetch('/blah').then(...);