Jak zadeklarować mapę zawierającą pewne właściwości z flowtype & immutable.js

Question

podany obiekt serwis stworzony jak ten

import {Map} from 'immutable' 
const website = new Map({name: 'My Website', url: 'http://www.myw.fr'}) 

Jak mogę zadeklarować websiteType która byłaby mapa zawierająca dokładnie podane właściwości. wiem, że mogę zrobić:

declare type websiteType = Map<string,string> 

Ale chciałbym być bardziej szczegółowe i zadeklarować mapę, która musi zawierać właściwości name i url typu string.

Czy to możliwe?

Answer 1

Mam nadzieję, że dostałem twoje pytanie, ponieważ nigdy nie użyłem mapy z "niezmiennej", dlatego użyję es6 Map.

Dlaczego po prostu nie skorzystasz z lekcji?

class Website extends Map<string, string> { 
    constructor(name: string, url: string) { 
     super() 
     this.set("name", name) 
     this.set("url", url) 
    } 
} 

ten sposób można zainicjować to tak:

const website = new Website("awesome", "www.awesome.com") 

a następnie wykonać operacje get i set.

W przypadku pominięcia parametrów typ przepływu spowoduje błąd.

Mam nadzieję, że to rozwiązanie dla Ciebie.

EDIT:

Można też po prostu stworzyć funkcję, która inicjuje swoją mapę.

declare type WebsiteType = Map<string, string> 

function createWebsite(name: string, description: string) { 
    const website: WebsiteType = new Map 
    website.set("name", name) 
    website.set("description", description) 
    return website 
} 

Jednak uważam, że pierwsze rozwiązanie ładniejszy ponieważ daje typ witryny i nie trzeba, aby utworzyć funkcję twórcy.

EDIT:

Jeśli chcesz taką samą składnię jak dawniej inicjalizacji mapy, można również zrobić:

class Website extends Map<string, string> { 
    constructor({name, url, ...rest}) { 
     super() 
     this.set("name", name) 
     this.set("url", url) 
     for(const name in rest) { 
      this.set(name, rest[name]) 
     } 
    } 
} 

Jednak myślę, że pierwszy z nich sens.

Answer 2

Niezmienny Map obsługuje polecenia pobierające/ustawiające, dzięki czemu można traktować je dokładnie tak, jak zwykły obiekt JS. Wystarczy utworzyć typ z pól, które trzeba ograniczać:

type Website = { 
    name: string, 
    url: string, 
} 

następnie używać go wszędzie tam, gdzie trzeba:

import {Map} from 'immutable' 

const website: Website = new Map({ 
    name: 'My Website', 
    url: 'http://www.myw.fr' 
}) 

website.name; // No error 
website.url; // No error 
website.somethingElse; // Error 

Answer 3

Nie sądzę Mapa jest rozwiązaniem tego problemu. Możesz ograniczyć to za pomocą wyliczenia, ale to nie rozwiązuje problemu.Oto niektóre wyniki, które dostałem podczas zabawy:

type MyKeys = 'A' | 'B'; 
declare type MyMapType = Map<MyKeys, number>; 

const TinyMap: MyMapType = Map({ 
    A: 1, 
}); 
// As expected this doesn't give an error 
console.log(TinyMap.get('B')); 

const MyMap: MyMapType = Map({ 
    A: 1, 
    B: 2, 
}); 

// Just a 'number' 
MyMap.get('A'); 

// Somewhat surprisingly this works fine 
const NewMap = MyMap.set('A', 'a'); 

// Now of type 'number | string' 
NewMap.get('A') 

// Forcing the return into the type causes the error that one 
// perhaps would expect: 'string This type is incompatible with number' 
const AnotherMap: MyMapType = MyMap.set('A', 'a');