TypeScript의 객체 배열 인터페이스
객체 배열을 인터페이스하는 방법과 객체 배열을 TypeScript의 예제와 인터페이스하는 다양한 방법을 소개합니다.
TypeScript의 객체 배열 인터페이스
객체 배열에 대한 인터페이스를 정의했습니다. 각 객체의 타입에 대한 인터페이스를 설명했습니다. 배열을 Type[]
으로 지정합니다.
예를 들어:
# typescript
const arr: Worker[] =[];
배열에 추가된 모든 객체는 유형을 따라야 합니다. 그렇지 않으면 유형 검사기에서 오류가 발생합니다.
# typescript
interface student {
studentId: number;
studentName: string;
}
const arr: Employee[] = [
{ studentId: 1, studentName: 'Maham' },
{ studentId: 2, studentName: 'Maryam' },
];
위의 예에서 객체 배열의 유형이 인터페이스로 사용됩니다. 각 개체에는 숫자
유형의 Id
와 문자열
유형의 이름
이 있습니다.
유형 검사기에 오류를 일으키는 다른 유형의 개체를 배열에 추가하려고 합니다.
# typescript
interface Company {
CompanyId: number;
CompanyName: string;
[key: string]: any;
}
이는 배열을 null로 할당할 때 매우 유용할 수 있습니다. null 배열을 할당하면 TypeScript는 해당 유형을 any[]
로 가정합니다.
# typescript
const arr2: Student[] = [
{ StudentId: 1, StudentName: 'Maham' },
{ StudentId: 2, StudentName: 'Maryam', wage: 100 },
];
위의 예에서 우리는 any
유형의 요소를 배열에 추가할 수 있다는 것을 알고 있으며 유형 검사기에서 도움을 받지 못했습니다.
오히려 우리는 모든 null 배열의 유형을 표현해야 합니다.
# typescript
interface Student {
StudentId: number;
StudentName: string;
}
const arr: Student[] = [
{ StudentId: 1, StudentName: 'Maham' },
{ StudentId: 2, StudentName: 'Maryam' },
];
arr.push({ Wage: 100 });
Worker
유형을 따르는 개체만 arr
배열에 추가할 수 있습니다.
시간 이전에 개체의 모든 속성 이름이 없다고 가정합니다. 인터페이스에서 색인 서명을 사용했습니다.
# typescript
const worker = [];
인덱스 서명은 유형 속성의 모든 이름과 모양의 값을 시간 경과에 따라 알 수 없을 때 유용합니다.
# typescript
interface Worker {
WorkerId: number;
WorkerName: string;
}
const arr: Worker[] = [];
위의 예에서 색인 서명 {[key: string]: string}
을 볼 수 있습니다. 그것은 문자열
로 인덱싱될 때 문자열
유형의 값으로 반환되는 키-값 구조를 표현했습니다.
또한 배열의 각 요소에는 숫자
유형의 id
와 문자열
유형의 이름
이 있습니다. 그것은 또한 다른 특성을 가질 수 있습니다.
여기서 키는 문자열이고 키의 값은 모든 유형이 될 수 있습니다.
이 접근 방식을 사용하는 동안 미리 알고 있는 인터페이스에 모든 속성을 명시적으로 추가해야 합니다.
유형 검사기의 사용을 가능한 한 제한하는 것이 이상적입니다.
Rana is a computer science graduate passionate about helping people to build and diagnose scalable web application problems and problems developers face across the full-stack.
LinkedIn