टाइपस्क्रिप्ट में वर्ग स्थिरांक कैसे लागू करें?

Question

टाइपस्क्रिप्ट में, constक्लास गुणों को घोषित करने के लिए कीवर्ड का उपयोग नहीं किया जा सकता है। ऐसा करने से कंपाइलर को "A वर्ग के सदस्य के पास 'कास्ट' कीवर्ड नहीं मिल सकता है।

मुझे खुद को कोड में स्पष्ट रूप से इंगित करने की आवश्यकता है कि एक संपत्ति को बदलना नहीं चाहिए। मैं चाहता हूँ कि आईडीई या संकलक त्रुटि कर सकता है यदि मैं घोषित किए जाने के बाद संपत्ति को एक नया मूल्य प्रदान करने का प्रयास करता हूं। आप लोग इसे कैसे हासिल करेंगे?

मैं वर्तमान में केवल पढ़ने के लिए संपत्ति का उपयोग कर रहा हूं, लेकिन मैं टाइपस्क्रिप्ट (और जावास्क्रिप्ट) के लिए नया हूं और आश्चर्य करता हूं कि क्या कोई बेहतर तरीका है:

get MY_CONSTANT():number {return 10};

मैं टाइपस्क्रिप्ट 1.8 का उपयोग कर रहा हूं। सुझाव?

पुनश्च: मैं अब टाइप कर रहा हूँ 2.0.3 का उपयोग, इसलिए मैंने डेविड का उत्तर स्वीकार कर लिया है

Answer 1

टाइपस्क्रिप्ट 2.0 में readonlyसंशोधक है :

class MyClass {
    readonly myReadOnlyProperty = 1;

    myMethod() {
        console.log(this.myReadOnlyProperty);
        this.myReadOnlyProperty = 5; // error, readonly
    }
}

new MyClass().myReadOnlyProperty = 5; // error, readonly

यह बिल्कुल स्थिर नहीं है, क्योंकि यह कंस्ट्रक्टर में असाइनमेंट की अनुमति देता है, लेकिन यह सबसे बड़ी बात नहीं है।

दूसरा तरीका

एक विकल्प के staticसाथ कीवर्ड का उपयोग करना है readonly:

class MyClass {
    static readonly myReadOnlyProperty = 1;

    constructor() {
        MyClass.myReadOnlyProperty = 5; // error, readonly
    }

    myMethod() {
        console.log(MyClass.myReadOnlyProperty);
        MyClass.myReadOnlyProperty = 5; // error, readonly
    }
}

MyClass.myReadOnlyProperty = 5; // error, readonly

इससे कंस्ट्रक्टर में असाइन नहीं होने और केवल एक स्थान पर मौजूद होने का लाभ होता है।

Comments

कक्षा के बाहर से गुण का उपयोग करने के लिए आपको जोड़ने की आवश्यकता होगी exportसे पहले कीवर्ड classके साथ-साथ public staticइससे पहले कि readonlyकीवर्ड। यहां देखें: stackoverflow.com/a/22993349

— cbros2008

सवाल। क्या कुलबुलाहट थी कि आपको कक्षा के नाम को उस वर्ग के अंदर ही पढ़ने योग्य संपत्ति का उपयोग करने की आवश्यकता थी? '

— MyClass.myReadonlyProperty

@SaiyaffFarouk यदि मैं आपके प्रश्न को समझता हूं, तो इसका उत्तर यह है कि स्थिर गुण वर्ग के हिस्से के रूप में मौजूद हैं, न कि कक्षा के एक उदाहरण पर। तो, आप उन्हें वर्ग नाम का उपयोग करके एक्सेस करते हैं न कि एक वैरिएबल जिसमें एक वर्ग उदाहरण होता है।

— जेफ्रीहॉशर

export(बाहरी मॉड्यूल) और publicकीवर्ड इस प्रश्न / उत्तर से संबंधित नहीं हैं, लेकिन मुखरता के विषय पर, मैं व्यक्तिगत रूप से यह बताने के लिए है कि एक सदस्य सार्वजनिक है जब कीवर्ड मौजूद नहीं है इसे खोजने के बेहद आसान। मैं उस कारण से परेशान नहीं करता हूं और क्योंकि यह अधिक शोर जोड़ता है और अनावश्यक टाइपिंग है। यह सार्वजनिक सदस्यों को privateया के रूप में चिह्नित लोगों से अधिक विशिष्ट बनाता है protected। वैसे भी, सिर्फ मेरी राय :)

— डेविड शेरेट

अनाम वर्गों के बारे में क्या? static readonly myReadOnlyPropertyकक्षा के साथ घोषित होने पर कैसे पहुँचें इस पर कोई विचार export default class { ... }? यह प्रयास किया गया। MyVar, self.myVar, static, default ... काम नहीं कर रहा है ... (EDIT: default.myVar इसका समाधान प्रतीत होता है, लेकिन मुझे एक प्रकार की त्रुटि मिल रही है)

— Alcalyn

Answer 2

लगातार कक्षाओं के बाहर घोषित किया जा सकता है और आपकी कक्षा के भीतर उपयोग किया जा सकता है। अन्यथा getसंपत्ति एक अच्छा समाधान है

const MY_CONSTANT: string = "wazzup";

export class MyClass {

    public myFunction() {

        alert(MY_CONSTANT);
    }
}

Comments

धन्यवाद; मैं इस कार्यान्वयन के बारे में चिंतित हूं क्योंकि यह पोर्टेबल नहीं है (मॉडल में, स्थिर वास्तव में वर्ग का हिस्सा नहीं है) और यह अधिक से अधिक दायरे में जानकारी लीक करता है, लेकिन यह एक वास्तविक निरंतर होने का लाभ है इसलिए मैंने जीता ' टी खतरे की घंटी को उठाए बिना इसे बदलने में सक्षम हो।

— बीटलज्यूइस

मैं चिंता को समझता हूं और मुझे getआपके मामले में संपत्ति का उपयोग उचित लगता है

— j3ff

प्रति angular.io/docs/ts/latest/guide/style-guide.html कृपया ऊपरी मामले के बजाय ऊंट कैस का उपयोग करें। स्थिरांक के लिए ऊपरी मामले की सिफारिश नहीं की जाती है।

— वादिम किरिलचुक

कोणीय स्टाइलगाइड, टाइपस्क्रिप्ट स्टाइलगाइड नहीं .. प्रश्न टाइपस्क्रिप्ट के बारे में विशेष रूप से था

— VeldMuijz

@ ईस्को मैं मानता हूं कि टाइपस्क्रिप्ट में कास्ट फाइल तक ही सीमित है क्योंकि प्रत्येक फाइल एक मॉड्यूल है। इसे बाहर सुलभ बनाने के लिए, आपको इसे घोषित करना होगा export constऔर फिर इसे किसी अन्य फ़ाइल से आयात करना होगा। हालांकि परीक्षण करना बहुत आसान होगा। बस constएक फ़ाइल में एक घोषित करें , और इसे निर्यात / आयात के बिना किसी अन्य में उपयोग करने की कोशिश करें, या ब्राउज़र कंसोल से इसका उपयोग करें।

— बीटलज्यूइस

Answer 3

आप readonlyअपनी घोषणा में संशोधक के साथ गुण चिह्नित कर सकते हैं :

export class MyClass {
  public static readonly MY_PUBLIC_CONSTANT = 10;
  private static readonly myPrivateConstant = 5;
}

@ वे टाइपस्क्रिप्ट डीप डाइव बुक - Readonly

Answer 4

कोणीय 2 एक बहुत अच्छी सुविधा प्रदान करता है जिसे ओपेक कॉन्स्टेंट कहा जाता है। एक वर्ग बनाएँ और अपारदर्शी स्थिरांक का उपयोग करते हुए सभी स्थिरांक को परिभाषित करें।

import { OpaqueToken } from "@angular/core";

export let APP_CONFIG = new OpaqueToken("my.config");

export interface MyAppConfig {
    apiEndpoint: string;
}

export const AppConfig: MyAppConfig = {    
    apiEndpoint: "http://localhost:8080/api/"    
};

App.module.ts में प्रदाताओं में इसे इंजेक्ट करें

आप इसे हर घटक में उपयोग करने में सक्षम होंगे।

कोणीय 4 के लिए EDIT:

कोणीय 4 के लिए नई अवधारणा है इंजेक्शन टोकन और अपारदर्शी टोकन कोणीय 4 में चित्रित किया गया है।

इंजेक्शन टोकन अपारदर्शी टोकन के शीर्ष पर कार्यात्मकता जोड़ता है, यह टाइपस्क्रिप्ट जेनरिक, प्लस इंजेक्शन टोकन के माध्यम से टोकन पर टाइप जानकारी संलग्न करने की अनुमति देता है, @Inject जोड़ने की आवश्यकता को हटा देता है

उदाहरण कोड

कोणीय 2 ओपेक टोकन का उपयोग करना

const API_URL = new OpaqueToken('apiUrl'); //no Type Check


providers: [
  {
    provide: DataService,
    useFactory: (http, apiUrl) => {
      // create data service
    },
    deps: [
      Http,
      new Inject(API_URL) //notice the new Inject
    ]
  }
]

कोणीय 4 इंजेक्शन टोकन का उपयोग करना

const API_URL = new InjectionToken<string>('apiUrl'); // generic defines return value of injector


providers: [
  {
    provide: DataService,
    useFactory: (http, apiUrl) => {
      // create data service
    },
    deps: [
      Http,
      API_URL // no `new Inject()` needed!
    ]
  }
]

इंजेक्शन टोकन को तार्किक रूप से Opaque टोकन के ऊपर डिज़ाइन किया गया है और Opaque टोकन Angli 4 में चित्रित किए गए हैं।

Comments

एक और। कोणीय एक 13 वर्षीय किशोर की तरह स्थिर है। उन्हें रिहा करने के कुछ महीने बाद सुविधाओं में कमी आती है। क्षुद्र।

— स्टैम

एक घटाओ। इस सवाल का एंगुलर से कोई लेना-देना नहीं है। यह एक टाइपस्क्रिप्ट समाधान का अनुरोध कर रहा है।

— बेन नीटिंग

Answer 5

या तो घोषित करने के लिए लगातार एक के साथ आसानी से संशोधक का उपयोग करें या एक वर्ग के बाहर एक निरंतर की घोषणा कर सकता है और विशेष रूप से केवल ऑपरेटर का उपयोग करके आवश्यक वर्ग में इसका उपयोग कर सकता है।

Answer 6

इसके लिए आप readonlyसंशोधक का उपयोग कर सकते हैं । वस्तु गुण जो हैंreadonly केवल ऑब्जेक्ट के प्रारंभ के दौरान असाइन किए जा सकते ।

कक्षाओं में उदाहरण:

class Circle {
  readonly radius: number;

  constructor(radius: number) {
    this.radius = radius;
  }

  get area() {
    return Math.PI * this.radius * 2;
  }
}

const circle = new Circle(12);
circle.radius = 12; // Cannot assign to 'radius' because it is a read-only property.

वस्तु शाब्दिक उदाहरण:

type Rectangle = {
  readonly height: number;
  readonly width: number;
};

const square: Rectangle = { height: 1, width: 2 };
square.height = 5 // Cannot assign to 'height' because it is a read-only property

यह भी जानने योग्य है कि readonlyसंशोधक विशुद्ध रूप से एक टाइपस्क्रिप्ट निर्माण है और जब टीएस को जेएस से संकलित किया जाता है तो निर्माण संकलित जेएस में मौजूद नहीं होगा। जब हम गुणों को संशोधित कर रहे हैं जो आसानी से टीएस संकलक हैं, तो हमें इसके बारे में चेतावनी देगा (यह वैध जेएस है)।

Answer 7

मेरे लिए पहले की कोई भी उत्तर कृति काम नहीं करती। मुझे अपने स्थिर वर्ग को एनम में बदलने की आवश्यकता थी। ऐशे ही:

export enum MyConstants {
  MyFirstConstant = 'MyFirstConstant',
  MySecondConstant = 'MySecondConstant'
}

फिर मेरे घटक में मैं अन्य उत्तरों में सुझाए अनुसार नई संपत्ति जोड़ता हूं

export class MyComponent {
public MY_CONTANTS = MyConstans;
constructor() { }
}

फिर मेरे घटक के टेम्पलेट में मैं इसे इस तरह से उपयोग करता हूं

<div [myDirective]="MY_CONTANTS.MyFirstConstant"> </div>

संपादित करें: क्षमा करें। मेरी समस्या ओपी से अलग थी। मैं अभी भी यहाँ छोड़ देता हूँ अगर किसी को मैं की तुलना में एक ही समस्या है।

Comments

स्थिरांक को बचाने के लिए एक एनुम का उपयोग करना किसी भी भाषा में अच्छा अभ्यास नहीं है।

— संगम

यह वर्तमान में उपलब्ध समाधानों के लिए सबसे अच्छा समाधान है। मुझे पता है कि एनम का उपयोग कैसे नहीं किया जाना चाहिए, लेकिन एंगुलर के साथ बांधने योग्य स्थिरांक का सबसे साफ तरीका है।

— जेन हरजू