객체를 사전으로 사용하는 JavaScript 코드가 있습니다. 예를 들어 ‘개인’개체는 전자 메일 주소를 사용하여 일부 개인 정보를 보관합니다.
var people = {<email> : <'some personal data'>};
adding > "people[<email>] = <data>;"
getting > "var data = people[<email>];"
deleting > "delete people[<email>];"
Typescript에서 이것을 설명 할 수 있습니까? 또는 배열을 사용해야합니까?
답변
최신 버전의 타이프 스크립트에서는 다음을 사용할 수 있습니다.
type Customers = Record<string, Customer>
이전 버전에서는 다음을 사용할 수 있습니다.
var map: { [email: string]: Customer; } = { };
map['foo@gmail.com'] = new Customer(); // OK
map[14] = new Customer(); // Not OK, 14 is not a string
map['bar@hotmail.com'] = 'x'; // Not OK, 'x' is not a customer
매번 전체 유형 주석을 입력하지 않으려는 경우 인터페이스를 만들 수도 있습니다.
interface StringToCustomerMap {
[email: string]: Customer;
}
var map: StringToCustomerMap = { };
// Equivalent to first line of above
답변
지도 와 같은 객체 를 사용하는 것 외에도 , 얼마 동안 실제 Map
객체 가 있었는데, ES6로 컴파일 할 때 또는 ES6 유형 정의 로 폴리 필을 사용할 때 TypeScript에서 사용할 수 있습니다 .
let people = new Map<string, Person>();
Object
약간 다른 구문으로와 같은 기능을 지원 합니다.
// Adding an item (a key-value pair):
people.set("John", { firstName: "John", lastName: "Doe" });
// Checking for the presence of a key:
people.has("John"); // true
// Retrieving a value by a key:
people.get("John").lastName; // "Doe"
// Deleting an item by a key:
people.delete("John");
이것만으로 다음 과 같은 맵 과 같은 객체 를 사용하는 것보다 몇 가지 장점이 있습니다.
- 문자열 기반이 아닌 키 (예 : 숫자 또는 객체)를 지원 하지 않음
Object
(아니오,Object
숫자를 지원하지 않는 경우 문자열로 변환) - 사용하지 않는 오류를 덜 룸
--noImplicitAny
A가로,Map
항상이 키의 유형과 값 유형을 객체가있는 반면, 수 인덱스-서명이 없습니다 - 항목 (키-값 쌍)을 추가 / 제거하는 기능은 속성을 생성하는 것과 달리 작업에 최적화 되어 있습니다.
Object
또한 Map
객체는 일반적인 작업에보다 강력하고 우아한 API를 제공하며, 대부분 Object
도우미 함수를 해킹하지 않고 간단한 기능으로 는 사용할 수 없습니다 (일부는 ES5 대상 이하의 경우 완전한 ES6 반복자 / 반복 가능한 폴리 필이 필요하지만).
// Iterate over Map entries:
people.forEach((person, key) => ...);
// Clear the Map:
people.clear();
// Get Map size:
people.size;
// Extract keys into array (in insertion order):
let keys = Array.from(people.keys());
// Extract values into array (in insertion order):
let values = Array.from(people.values());
답변
다음과 같은 템플릿 인터페이스를 사용할 수 있습니다.
interface Map<T> {
[K: string]: T;
}
let dict: Map<number> = {};
dict["one"] = 1;
답변
typescript에서 레코드 유형을 사용할 수도 있습니다.
export interface nameInterface {
propName : Record<string, otherComplexInterface>
}
답변
Lodash는 간단한 사전 구현을 가지고 있으며 TypeScript를 잘 지원합니다.
Lodash를 설치하십시오.
npm install lodash @types/lodash --save
가져 오기 및 사용법 :
import { Dictionary } from "lodash";
let properties : Dictionary<string> = {
"key": "value"
}
console.log(properties["key"])
답변
Record
이것을 위해 사용할 수 있습니다 :
https://www.typescriptlang.org/docs/handbook/utility-types.html#recordkt
예 (AppointmentStatus 열거 형과 일부 메타 데이터 간의 매핑) :
const iconMapping: Record<AppointmentStatus, Icon> = {
[AppointmentStatus.Failed]: { Name: 'calendar times', Color: 'red' },
[AppointmentStatus.Canceled]: { Name: 'calendar times outline', Color: 'red' },
[AppointmentStatus.Confirmed]: { Name: 'calendar check outline', Color: 'green' },
[AppointmentStatus.Requested]: { Name: 'calendar alternate outline', Color: 'orange' },
[AppointmentStatus.None]: { Name: 'calendar outline', Color: 'blue' }
}
이제 인터페이스를 가치로 사용하십시오.
interface Icon {
Name: string
Color: string
}
용법:
const icon: SemanticIcon = iconMapping[appointment.Status]
답변
타이프 스크립트에 강력한 형식의 쿼리 가능한 컬렉션 을 제공하는 라이브러리가 있습니다 .
컬렉션은 다음과 같습니다
- 명부
- 사전
라이브러리를 ts-generic-collections 라고 합니다. ( GitHub의 소스 코드 )
사전을 만들고 아래와 같이 쿼리 할 수 있습니다.
it('firstOrDefault', () => {
let dictionary = new Dictionary<Car, IList<Feature>>();
let car = new Car(1, "Mercedez", "S 400", Country.Germany);
let car2 = new Car(2, "Mercedez", "S 500", Country.Germany);
let features = new List<Feature>();
let feature = new Feature(1, "2 - Door Sedan");
features.add(feature);
dictionary.add(car, features);
features = new List<Feature>();
feature = new Feature(2, "4 - Door Sedan");
features.add(feature);
dictionary.add(car2, features);
//query
let first = dictionary.firstOrDefault(x => x.key.name == "Mercedez");
expect(first.key.id = 1);
});