টাইপস্ক্রিপ্টে ক্লাস কনস্ট্যান্ট কীভাবে প্রয়োগ করা যায়?


429

টাইপস্ক্রিপ্টে, const কীওয়ার্ডটি শ্রেণীর বৈশিষ্ট্যগুলি ঘোষণার জন্য ব্যবহার করা যায় না। এটি করার ফলে "একটি শ্রেণীর সদস্যের 'কনস্ট' শব্দটি থাকতে পারে না with

আমি নিজেকে কোডে স্পষ্টভাবে ইঙ্গিত করার প্রয়োজন মনে করি যে কোনও সম্পত্তি পরিবর্তন করা উচিত নয়। আমি আইডিই বা সংকলকটি ত্রুটিযুক্ত হতে চাই যদি আমি সম্পত্তিটি এটি ঘোষণার পরে একবার নতুন মান নির্ধারণের চেষ্টা করি। আপনি কিভাবে এই অর্জন?

আমি বর্তমানে কেবল পঠনযোগ্য সম্পত্তি ব্যবহার করছি তবে আমি টাইপসক্রিপ্টে নতুন (এবং জাভাস্ক্রিপ্ট) আছি এবং আরও ভাল উপায় আছে কিনা তা নিয়ে ভাবছি:

get MY_CONSTANT():number {return 10};

আমি টাইপস্ক্রিপ্ট ব্যবহার করছি 1.8। পরামর্শ?

পিএস: আমি এখন টাইপস্ক্রিপ্ট ২.০.৩ ব্যবহার করছি, তাই আমি ডেভিডের উত্তর গ্রহণ করেছি

উত্তর:


651

টাইপস্ক্রিপ্ট ২.০ এর 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

এটি কনস্ট্রাক্টারে অ্যাসাইনযোগ্য না হয়ে এবং কেবলমাত্র এক জায়গায় বিদ্যমান থাকার সুবিধা রয়েছে।


31
বর্গ বাইরে থেকে বৈশিষ্ট্য অ্যাক্সেস করতে, আপনাকে যোগ করতে হবে exportআগে শব্দ classসেইসাথে public staticসামনে readonlyশব্দ। এখানে দেখুন: stackoverflow.com/a/22993349
cbros2008

প্রশ্ন। ক্লাসের ভিতরে থাকা এই পড়ার একমাত্র সম্পত্তিটি ব্যবহার করার জন্য আপনার ক্লাসের নামটি কেন দরকার ছিল তা নির্বোধ ছিল? 'মাই ক্লাস.মি রেডনলিপ্রপার্টি'
সাইয়্যাফ ফারুক

@ সাইয়াফফারউক যদি আমি আপনার প্রশ্নটি বুঝতে পারি তবে উত্তরটি হ'ল স্থির বৈশিষ্ট্য শ্রেণীর অংশ হিসাবে উপস্থিত রয়েছে, শ্রেণির কোনও উদাহরণে নয়। সুতরাং, আপনি ক্লাসের নামটি ব্যবহার করে এগুলি অ্যাক্সেস করে ভেরিয়েবল নয় যা কোনও শ্রেণীর উদাহরণ রয়েছে।
জেফরিহাউসার

1
export(বাহ্যিক মডিউল) এবং publicশব্দ এই প্রশ্নের / উত্তর অসম্পর্কিত, কিন্তু explicitness বিষয় উপর, আমি ব্যক্তিগতভাবে বলতে সদস্য সর্বজনীন যখন শব্দ উপস্থিত না থাকলে সেটা খুঁজে অত্যন্ত সহজ। আমি সে কারণে এটি নিয়ে বিরক্ত করি না এবং কারণ এটি আরও শব্দ যোগ করে এবং অযথা টাইপ করা। এছাড়া পাবলিক সদস্যদের আরো হিসাবে চিহ্নিত বেশী থেকে স্বতন্ত্র করে তোলে privateবা protected। যাইহোক, কেবল আমার মতামত :)
ডেভিড শেরেট

বেনাম ক্লাস সম্পর্কে কি? static readonly myReadOnlyPropertyক্লাসটি ঘোষিত হলে কীভাবে অ্যাক্সেস করবেন সে সম্পর্কে কোনও ধারণা export default class { ... }? এটি.মাইভর, ​​সেলফ.মিওয়ার, স্ট্যাটিক, ডিফল্ট ... কাজ করছে না ... চেষ্টা করেছেন ... (এডিআইটি: ডিফল্ট.ওয়াইওয়্যারটি সমাধান বলে মনে হচ্ছে, তবে আমি
একধরণের

67

ধ্রুবকগুলি ক্লাসের বাইরে ঘোষিত হতে পারে এবং আপনার ক্লাসের মধ্যে ব্যবহার করতে পারে। অন্যথায় getসম্পত্তি একটি দুর্দান্ত কাজ

const MY_CONSTANT: string = "wazzup";

export class MyClass {

    public myFunction() {

        alert(MY_CONSTANT);
    }
}

6
ধন্যবাদ; আমি এই বাস্তবায়ন সম্পর্কে উদ্বিগ্ন কারণ এটি পোর্টেবল নয় (মডেলটিতে ধ্রুবকটি আসলে শ্রেণীর অংশ নয়) এবং এটি তথ্যকে আরও বৃহত্তর স্কোপের মধ্যে ফাঁস করে দেয়, তবে এটি সত্যিকারের ধ্রুবক হওয়ার সুবিধা রয়েছে তাই আমি জিতেছি ' অ্যালার্ম বেল না বাড়িয়ে এটি পরিবর্তন করতে সক্ষম হবেন না।
বিটলজুইস

1
আমি উদ্বেগটি বুঝতে পেরেছি এবং আমি getআপনার ক্ষেত্রে সম্পত্তিটির ব্যবহার খুব উপযুক্ত বলে মনে করি
j3ff

3
Angular.io/docs/ts/latest/guide/style-guide.html প্রতি দয়া করে উপরের কেসের পরিবর্তে উটের কেস ব্যবহার করুন। ধ্রুবকগুলির জন্য উচ্চতর ক্ষেত্রে বাঞ্ছনীয় নয়।
ভাদিম কিরিলচুক

12
কৌণিক
স্টাইলগাইড

4
@ এসকো আমি বিশ্বাস করি যে টাইপস্ক্রিপ্টে কনস্টটি ফাইলের মধ্যে সীমাবদ্ধ কারণ প্রতিটি ফাইলই মডিউল। এটিকে বাইরের অ্যাক্সেসযোগ্য করার জন্য আপনাকে এটিকে ডিক্লেয়ার করতে হবে export constএবং তারপরে এটি অন্য কোনও ফাইল থেকে আমদানি করতে হবে। যদিও পরীক্ষা করা বেশ সহজ হবে। কেবলমাত্র একটি constফাইলের মধ্যে একটি ঘোষণা করুন এবং এটিকে রফতানি / আমদানি ছাড়াই অন্যটিতে ব্যবহার করার চেষ্টা করুন বা ব্রাউজার কনসোল থেকে এটি ব্যবহার করার চেষ্টা করুন।
বিটলজুইস


11

কৌণিক 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 এর জন্য সম্পাদনা করুন:

কৌণিক 4 এর জন্য নতুন ধারণাটি ইনজুলার টোকেন এবং ওপাক টোকেনটি কৌনিক 4 এ অবমূল্যায়িত হয়েছে।

ইনজেকশন টোকেন ওপাক টোকেনের শীর্ষে কার্যকারিতা যুক্ত করে, এটি টাইপস্ক্রিপ্ট জেনেরিকস, ইনজেকশন টোকেনগুলির মাধ্যমে টোকেনে টাইপ তথ্য সংযুক্ত করতে দেয়, @ ইনজেক্ট যুক্ত করার প্রয়োজনীয়তা সরিয়ে দেয়

উদাহরণ কোড

কৌণিক 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!
    ]
  }
]

ইনজেকশন টোকেনগুলি ওপাক টোকেনের শীর্ষে যৌক্তিকভাবে ডিজাইন করা হয়েছে এবং ওপাক টোকেনগুলি কৌণিক 4 এ অবহেলা করা হয়েছে।


6
এক যোগ করুন. কৌণিক 13 বছরের এক কিশোরের মতো স্থিতিশীল। এগুলি প্রকাশের কয়েক মাস পরে তারা বৈশিষ্ট্যগুলি হ্রাস পেয়েছে। ক্ষুদ্র।
স্ট্যাভম

1
বিয়োগ এক. এই প্রশ্নের অ্যাঙ্গুলারের সাথে কোনও সম্পর্ক নেই। এটি একটি টাইপস্ক্রিপ্ট সমাধানের জন্য অনুরোধ করছে।
বেন নিটিং 0

4

হয় কেবলমাত্র ধ্রুবক ব্যক্তির প্রয়োজন পড়ার সাথে কেবলমাত্র পঠনযোগ্য পরিবর্তক ব্যবহার করুন বা শ্রেণীর বাইরে কেউ ধ্রুবক ঘোষণা করতে পারেন এবং কেবলমাত্র প্রয়োজনীয় শ্রেণিতে এটি ব্যবহার করুন অপারেটর ব্যবহার করে।


1

এর জন্য আপনি 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রাখাও উপযুক্ত যে সংশোধকটি নিখুঁতভাবে একটি টাইপস্ক্রিপ্ট নির্মাণ এবং যখন টিএসটি জেএসে সংকলিত হয় তখন নির্মাণটি সংকলিত জেএসে উপস্থিত হবে না। আমরা যখন এমন বৈশিষ্ট্যগুলি সংশোধন করছি যা কেবলমাত্র পাঠ্য টিএস সংকলক এটি সম্পর্কে আমাদের সতর্ক করবে (এটি বৈধ জেএস)।


-2

আমার জন্য আগের উত্তরগুলির কোনওটিই কাজ করে না। আমার স্ট্যাটিক ক্লাসটি এনামে রূপান্তর করা দরকার ছিল না। এটার মত:

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

তারপরে আমার উপাদানগুলিতে আমি অন্যান্য উত্তরে প্রস্তাবিত হিসাবে নতুন সম্পত্তি যুক্ত করব

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

তারপরে আমার উপাদানগুলির টেমপ্লেটে আমি এটি এভাবে ব্যবহার করি

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

সম্পাদনা: দুঃখিত। আমার সমস্যা ওপির চেয়ে আলাদা ছিল। কারও কারও আমার চেয়ে একই সমস্যা থাকলে আমি এখনও এটি এখানে রেখে দিই


ধ্রুবককে বাঁচাতে এনাম ব্যবহার করা কোনও ভাষায় ভাল অভ্যাস নয়।
সংঘবদ্ধ

এটি বর্তমানে উপলব্ধ সমাধানগুলির জন্য সেরা সমাধান। আমি জানি এটি কীভাবে এনাম ব্যবহার করা উচিত নয় তবে কৌনিক সহ এটি বাইন্ডেবল ধ্রুবকগুলির সবচেয়ে সহজ উপায়।
জান্নে হারজু
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.