Làm thế nào tôi có thể xác định một mảng các đối tượng?


197

Tôi đang tạo một mảng các đối tượng trong TypeScript:

 userTestStatus xxxx = {
    "0": { "id": 0, "name": "Available" },
    "1": { "id": 1, "name": "Ready" },
    "2": { "id": 2, "name": "Started" }
 };

Ai đó có thể cho tôi biết làm thế nào tôi có thể khai báo chính xác loại của nó? Có thể làm nội tuyến hay tôi sẽ cần hai định nghĩa?

Tôi đang tìm cách thay thế xxxbằng một khai báo kiểu, để sau này trên TypeScript sẽ cảnh báo tôi nếu tôi sử dụng một cái gì đó giống như userTestStatus[3].nammmedo nhầm lẫn.

Câu trả lời:


279

Bạn nên sử dụng một mảng riêng thay vì một đối tượng bằng chữ với các thuộc tính giống như số, do đó việc đánh số (cũng như nhiều hàm mảng khác) được quan tâm ngoài giá trị.

Những gì bạn đang tìm kiếm ở đây là một định nghĩa giao diện nội tuyến cho mảng của bạn xác định mọi phần tử trong mảng đó, cho dù ban đầu có mặt hay được giới thiệu sau:

let userTestStatus: { id: number, name: string }[] = [
    { "id": 0, "name": "Available" },
    { "id": 1, "name": "Ready" },
    { "id": 2, "name": "Started" }
];

userTestStatus[34978].nammme; // Error: Property 'nammme' does not exist on type [...]

Nếu bạn đang khởi tạo mảng của mình với các giá trị ngay lập tức, định nghĩa kiểu rõ ràng không phải là điều cần thiết; TypeScript có thể tự động suy ra hầu hết các loại phần tử từ bài tập ban đầu:

let userTestStatus = [
    { "id": 0, "name": "Available" },
    ...
];

userTestStatus[34978].nammme; // Error: Property 'nammme' does not exist on type [...]

4
Ngoài ra, bạn có thể khai báo một loạt các đối tượng theo cách này:let someArray: Array<{ id: number, name: string }> = []
Alexander Kim

74

Những gì bạn có ở trên là một đối tượng, không phải là một mảng.

Để tạo một mảng sử dụng [& ]bao quanh các đối tượng của bạn.

userTestStatus = [
  { "id": 0, "name": "Available" },
  { "id": 1, "name": "Ready" },
  { "id": 2, "name": "Started" }
];

Bên cạnh đó, TypeScript là một siêu mã JavaScript, vì vậy bất kỳ JavaScript nào hợp lệ cũng sẽ là TypeScript hợp lệ để không cần thay đổi nào khác.

Làm rõ phản hồi từ OP ... cần một định nghĩa cho mô hình được đăng

Bạn có thể sử dụng các loại được xác định ở đây để thể hiện mô hình đối tượng của bạn:

type MyType = {
    id: number;
    name: string;
}

type MyGroupType = {
    [key:string]: MyType;
}

var obj: MyGroupType = {
    "0": { "id": 0, "name": "Available" },
    "1": { "id": 1, "name": "Ready" },
    "2": { "id": 2, "name": "Started" }
};
// or if you make it an array
var arr: MyType[] = [
    { "id": 0, "name": "Available" },
    { "id": 1, "name": "Ready" },
    { "id": 2, "name": "Started" }
];

Xin lỗi có lẽ câu hỏi của tôi không rõ ràng. Điều tôi muốn làm là tìm một định nghĩa cho userTestStatus.

1
@Marilou Bạn thường có thể có được định nghĩa đơn giản bằng cách di chuột qua userTestStatusbiến trong IDE yêu thích của bạn ... sân chơi TypeScript hiển thị { id: number, name: string; }[]. Bạn có thể gói nó trong một giao diện nếu bạn thích interface NameThis { id: number, name: string; }NameThis[]là kiểu mảng.
Fenton

Tôi đã thử điều này nhưng nó cho tôi một vài lỗi. Tuy nhiên tôi nghĩ nó giống như tôi muốn: userTestStatus: {id: number, name: string; } [] = {"0": {"id": 0, "name": "Available"}, "1": {"id": 1, "name": "Ready"},

Trong ví dụ của bạn xác định var arr: MyType, bạn sẽ không sử dụng các khai báo tên / chỉ mục thuộc tính như "0": { … }; bạn sẽ chỉ sử dụng các đối tượng theo nghĩa đen vào thời điểm này.
gfullam

@gfullam bạn đúng, tôi đã cập nhật câu trả lời của tôi (đó là một chỉnh sửa bất cẩn nhanh chóng)
Brocco

34

Một số tslintquy tắc đang vô hiệu hóa việc sử dụng [], thông báo ví dụ:Array type using 'T[]' is forbidden for non-simple types. Use 'Array<T>' instead.

Sau đó, bạn sẽ viết nó như sau:

var userTestStatus: Array<{ id: number, name: string }> = Array(
    { "id": 0, "name": "Available" },
    { "id": 1, "name": "Ready" },
    { "id": 2, "name": "Started" }
);

2
Cách tiếp cận pratical nhất bao giờ hết. nó là giải pháp đơn giản và trực tiếp cho các trường hợp sử dụng mảng đơn giản. Lấy +1 của tôi
Julio Vedovatto

16

Những gì bạn thực sự muốn có thể chỉ đơn giản là một bảng liệt kê

Nếu bạn đang tìm kiếm một thứ gì đó giống như một bảng liệt kê (vì tôi thấy bạn đang xác định một đối tượng và đính kèm một ID tuần tự 0, 1, 2 và chứa một trường tên mà bạn không muốn viết sai chính tả (ví dụ như tên vs naaame) , tốt hơn hết là bạn nên xác định một bảng liệt kê vì ID tuần tự được xử lý tự động và cung cấp xác minh loại cho bạn ra khỏi hộp.

enum TestStatus {
    Available,     // 0
    Ready,         // 1
    Started,       // 2
}

class Test {
    status: TestStatus
}

var test = new Test();
test.status = TestStatus.Available; // type and spelling is checked for you,
                                    // and the sequence ID is automatic

Các giá trị ở trên sẽ được ánh xạ tự động, ví dụ "0" cho "Có sẵn" và bạn có thể truy cập chúng bằng cách sử dụng TestStatus.Available. Và Typecript sẽ thực thi kiểu khi bạn vượt qua những người xung quanh.

Nếu bạn khăng khăng xác định một loại mới là một mảng của loại tùy chỉnh của bạn

Bạn muốn một mảng các đối tượng, (không chính xác là một đối tượng có các khóa "0", "1" và "2"), vì vậy hãy xác định loại đối tượng, trước tiên, sau đó là một loại của một mảng chứa.

class TestStatus {
    id: number
    name: string

    constructor(id, name){
        this.id = id;
        this.name = name;
    }
}

type Statuses = Array<TestStatus>;

var statuses: Statuses = [
    new TestStatus(0, "Available"),
    new TestStatus(1, "Ready"),
    new TestStatus(2, "Started")
]

Xin lỗi có lẽ câu hỏi của tôi không rõ ràng. Điều tôi muốn làm là tìm một định nghĩa cho userTestStatus để Bản mô tả sẽ cho phép tôi kiểm tra xem nó được sử dụng ở đâu và vì vậy, ví dụ tôi không thể nhập userTestStatus [1] .naaaame.

Tôi muốn tìm một cái gì đó để đặt giữa "userTestStatus" và "=". Theo cùng một cách mà tôi có thể đặt chuỗi hoặc số ở đó để nói loại biến có. Một cái gì đó giống như Brocco vừa làm nhưng chỉ với một dòng nếu điều đó là có thể.

-1

Bạn cũng có thể thử

    interface IData{
        id: number;
        name:string;
    }

    let userTestStatus:Record<string,IData> = {
        "0": { "id": 0, "name": "Available" },
        "1": { "id": 1, "name": "Ready" },
        "2": { "id": 2, "name": "Started" }
    };

Để kiểm tra cách hoạt động của bản ghi: https://www.typescriptlang.org/docs/handbook/utility-types.html#recordkt

Ở đây trong trường hợp của chúng tôi, Record được sử dụng để khai báo một đối tượng có khóa sẽ là một chuỗi và giá trị của nó sẽ thuộc loại IData, vì vậy bây giờ nó sẽ cung cấp cho chúng tôi thông báo khi chúng tôi sẽ cố gắng truy cập vào thuộc tính của nó và sẽ đưa ra lỗi loại trong trường hợp chúng tôi sẽ thử một cái gì đó như userTestStatus [0] .nameee


bạn nên cung cấp thêm thông tin về lý do tại sao điều này giải quyết vấn đề trong tay
Cornel Raiu
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.