টাইপস্ক্রিপ্টে ES6 মানচিত্র


173

আমি টাইপস্ক্রিপ্টে এমন একটি শ্রেণি তৈরি করছি যার একটি সম্পত্তি রয়েছে যা ES6 (ECMAscript 2016) এর মতো মানচিত্র রয়েছে:

class Item {
  configs: ????;
  constructor () {
    this.configs = new Map();
  }
}

আমি কীভাবে টাইপস্ক্রিপ্টে একটি ES6 মানচিত্র প্রকার ঘোষণা করব?

উত্তর:


233

সম্পাদনা (জুন 5 2019): যদিও "টাইপসক্রিপ্ট Mapস্থানীয়ভাবে সমর্থন করে" ধারণাটি এখনও সত্য, যেহেতু সংস্করণ ২.১ টাইপসক্রিপ্ট কিছুটিকে সমর্থন করে Record

type MyMapLikeType = Record<string, IPerson>;
const peopleA: MyMapLikeType = {
    "a": { name: "joe" },
    "b": { name: "bart" },
};

দুর্ভাগ্যক্রমে প্রথম জেনেরিক প্যারামিটার (কী টাইপ) এখনও পুরোপুরি সম্মানিত হয় না: এমনকি কোনও stringপ্রকারের সাথে peopleA[0](ক number) এর মতো কিছু এখনও বৈধ।


সম্পাদনা (এপ্রিল 25 2016): নীচের উত্তরগুলি পুরানো এবং সেরা উত্তর হিসাবে বিবেচনা করা উচিত নয়। টাইপস্ক্রিপ্ট মানচিত্রকে এখন "নেটিভালি" সমর্থন করে, সুতরাং আউটপুট ES6 এ কেবল ES6 মানচিত্র ব্যবহার করার অনুমতি দেয়। ইএস 5 এর জন্য এটি পলিফিল সরবরাহ করে না; এগুলি আপনাকে নিজেরাই এম্বেড করা দরকার।

আরও তথ্যের জন্য আরও আধুনিক উত্তরের জন্য নীচে মোহাম্মদ হেগাজির উত্তরটি দেখুন বা একটি সংক্ষিপ্ত সংস্করণের জন্য এই রেডডিট মন্তব্যটিও দেখুন


1.5.0 বিটা হিসাবে, টাইপস্ক্রিপ্ট এখনও মানচিত্র সমর্থন করে না । এটি এখনও রোডম্যাপের অংশ নয় , হয় না।

বর্তমান সেরা সমাধানটি টাইপযুক্ত কী এবং মান (কখনও কখনও হ্যাশম্যাপ হিসাবে পরিচিত) সহ একটি অবজেক্ট। প্রকারের কী এবং প্রকারের stringমান সহ একটি সামগ্রীর জন্য number:

var arr : { [key:string]:number; } = {};

কিছু সতর্কতা, যদিও:

  1. কীগুলি কেবল টাইপ stringবা হতে পারেnumber
  2. মূল কী হিসাবে আপনি কী ব্যবহার করেন তা আসলে কিছু যায় আসে না, যেহেতু সংখ্যা / স্ট্রিংগুলি এখনও বিনিময়যোগ্যভাবে গ্রহণ করা হয় (কেবলমাত্র মান প্রয়োগ করা হয়)।

উপরের উদাহরণ সহ:

// OK:
arr["name"] = 1; // String key is fine
arr[0] = 0; // Number key is fine too

// Not OK:
arr[{ a: "a" }] = 2; // Invalid key
arr[3] = "name"; // Invalid value

3
তাহলে কীভাবে আপনি মানচিত্রে বৈশিষ্ট্যগুলি পুনরায় পাঠ করবেন? আমি যখন আধ্যাত্মিক মূল্যগুলি () করি, তখন আমি পাই "সম্পত্তি 'মানগুলি টাইপটিতে বিদ্যমান নেই ..."
ভার্ন জেনসেন

values()আমি যেমন করতাম for (var key in arr) ... arr[key]বা করতাম তেমন নয় for...of। অন্যান্য সমাধান (যা আজকাল আরও বেশি বাস্তববাদী এবং এটি অনেক কিছুর জন্য কিছু সময়ের জন্য হবে) হ'ল কোরজ ব্যবহার করা ।
zeh

আসলে আমি যখন কোনও মানচিত্রে এই জাতীয় ঘোষিত সম্পত্তি হিসাবে কোনও কী ব্যবহার করি তখন আমি "সম্পত্তি 'যা কিছুই'
টাইপটিতে

আমি একটি তৈরি করতে মানচিত্রের ক্লাসটি ব্যবহার করছি, তবে আমি map Map<string,string>=new Map<string,string>()যখন map.set(something) ব্যতিক্রম পাই তখনও আমি তা করি map is undefined, তবে এটি আরম্ভ করার অন্য কোনও উপায় আছে কি?
mautrok

1
যখন ES5 targetting, এমনকি polyfills সঙ্গে, আপনি কিছু বৈশিষ্ট্য ব্যবহার করতে পারবেন না - github.com/Microsoft/TypeScript/issues/6842 দেখতে
Ondra Žižka

128

মন্তব্য দেখুন: https://github.com/Mic Microsoft / TypeScript / issues / 3069#issuecomment-99964139

টাইপস্ক্রিপ্ট পলিফিলস ইন বিল্ট সহ আসে না। কোন পলিফিল ব্যবহার করবেন তা যদি সিদ্ধান্ত নেওয়া হয় তবে তা নির্ভরযোগ্য। আপনি এস 6 সংকলন , এস 6-শিমস , কোরজস ইত্যাদি ইত্যাদি ব্যবহার করতে পারেন । সমস্ত টাইপস্ক্রিপ্ট সংকলক প্রয়োজন আপনি ব্যবহার করতে চান ES6 কনস্ট্রাক্টস জন্য একটি ঘোষণা। আপনি এই লিবিব ফাইলে তাদের সমস্ত খুঁজে পেতে পারেন ।

এখানে প্রাসঙ্গিক অংশ:

interface Map<K, V> {
    clear(): void;
    delete(key: K): boolean;
    entries(): IterableIterator<[K, V]>;
    forEach(callbackfn: (value: V, index: K, map: Map<K, V>) => void, thisArg?: any): void;
    get(key: K): V;
    has(key: K): boolean;
    keys(): IterableIterator<K>;
    set(key: K, value?: V): Map<K, V>;
    size: number;
    values(): IterableIterator<V>;
    [Symbol.iterator]():IterableIterator<[K,V]>;
    [Symbol.toStringTag]: string;
}

interface MapConstructor {
    new <K, V>(): Map<K, V>;
    new <K, V>(iterable: Iterable<[K, V]>): Map<K, V>;
    prototype: Map<any, any>;
}
declare var Map: MapConstructor;

3
যখন ES5 targetting, এমনকি polyfills সঙ্গে, আপনি নির্দিষ্ট বৈশিষ্ট্য ব্যবহার করতে পারবেন না - দেখুন github.com/Microsoft/TypeScript/issues/6842
Ondra Žižka


30

হ্যাঁ মানচিত্র এখন টাইপস্ক্রিপ্টে উপলভ্য .. আপনি যদি lib.es6.d.ts এ সন্ধান করেন তবে আপনি ইন্টারফেসটি দেখতে পাবেন:

interface Map<K, V> {
  clear(): void;
  delete(key: K): boolean;
  forEach(callbackfn: (value: V, key: K, map: Map<K, V>) => void,thisArg?: any): void;
  get(key: K): V | undefined;
  has(key: K): boolean;
  set(key: K, value: V): this;
  readonly size: number;} 

স্ট্রিং, অবজেক্ট পেয়ারের অভিধান হিসাবে এটি ব্যবহার করা দুর্দান্ত the একমাত্র বিরক্তি হ'ল আপনি যদি এটিকে মানচিত্রের সাথে অন্য কোথাও মান নির্ধারণ করতে ব্যবহার করছেন তবে কোডের মতো আইডিই আপনাকে সম্ভাব্য অপরিবর্তিত হওয়া সম্পর্কে সমস্যা দেয় .. একটি সংজ্ঞায়িত চেক দিয়ে একটি ভেরিয়েবল তৈরি করা .. কেবল টাইপটি কাস্ট করুন (মানচিত্রে কী-মানটির জোড় রয়েছে তা নিশ্চিত আপনি জানেন)

class myclass {
   mymap:Map<string,object>
   ...
   mymap = new Map<string,object>()
   mymap.set("akey",AnObject)
   let objectref = <AnObject>mymap.get("akey")

12

আমি কীভাবে টাইপস্ক্রিপ্টে একটি ES6 মানচিত্র প্রকার ঘোষণা করব?

আপনার লক্ষ্য করা দরকার --module es6। এটি দুর্ভাগ্যজনক এবং আপনি এখানে আপনার উদ্বেগ উত্থাপন করতে পারেন: https://github.com/Mic Microsoft/TypeScript/issues/2953#issuecomment- 98514111



4

নিশ্চিত না যে এটি অফিসিয়াল কিনা তবে এটি টাইপস্ক্রিপ্ট ২.7.১ এ আমার জন্য কাজ করেছে:

class Item {
   configs: Map<string, string>;
   constructor () {
     this.configs = new Map();
   }
}

সহজ সরল Map<keyType, valueType>


3

সঙ্গে liberal এর সংক্ষিপ্ত রূপ কনফিগ বিকল্প আপনার চেরি করতে পারবেন আপনার প্রকল্পে ম্যাপ বাছাই। es2015.collectionআপনার লিব বিভাগে কেবল যুক্ত করুন । আপনার সাথে কোন liberal এর সংক্ষিপ্ত রূপ কনফিগ অ্যাড এক আছে যখন অক্ষমতা এবং অ্যাড es2015.collection

সুতরাং আপনার যখন লক্ষ্য রয়েছে: এস 5, tsconfig.json এ এতে পরিবর্তন করুন:

"target": "es5",
"lib": [ "dom", "es5", "scripthost", "es2015.collection" ],

1

টাইপস্ক্রিপ্ট এখনও সমর্থন করে না Map

ES6 সামঞ্জস্যতা সারণী


4
: টাইপ করা বিষয় এর উইকি এ এই পৃষ্ঠাটিতে বলতে চাই যে এটা সমর্থিত বলে মনে হয় typescript.codeplex.com/...
nicksrandall

2019 জুন - মানচিত্র সমর্থিত
ইয়েহোনাতান ইহেজেল

0

যোগ "target": "ESNEXT"করার জন্য সম্পত্তি tsconfig.jsonফাইল।

{
    "compilerOptions": {
        "target": "ESNEXT" /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', or 'ESNEXT'. */
    }
}
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.