Tìm kiếm trang web

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

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 kiểu của nó một cách đúng không? Có thể làm trực tiếp hay tôi sẽ cần hai định nghĩa?

Tôi đang muốn thay thế xxx bằng một khai báo kiểu, để sau này TypeScript có thể cảnh báo tôi nếu tôi vô tình sử dụng thứ gì đó như userTestStatus[3].nammme.

Câu trả lời #1

Bạn nên sử dụng một mảng gốc thay vì một đối tượng literal với các thuộc tính giống số, để việc đánh số (cũng như nhiều chức năng khác của mảng) được xử lý sẵn.

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, định nghĩa từng phần tử trong mảng đó, dù ban đầu có mặt hay được thêm vào sau này:

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, việ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 luận hầu hết các kiểu phần tử từ phép gán ban đầu:

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

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

Câu trả lời #2

Những gì bạn có ở trên là một đối tượng, không phải 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" }
];

Ngoài ra, TypeScript là một tập hợp mở rộng của JavaScript, vì vậy bất cứ thứ gì hợp lệ trong JavaScript cũng sẽ hợp lệ trong TypeScript, nên không cần thay đổi gì khác.

Làm rõ phản hồi từ người đăng... 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 định nghĩa ở đây để biểu diễ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" }
];

Câu trả lời #3

Một số quy tắc tslint đang tắt việc sử dụng [], ví dụ thông báo: Loại mảng sử dụng 'T[]' bị cấm cho các loại không đơn giản. Hãy sử dụng 'Array<T>' thay thế.

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" }
);

Câu trả lời #4

Array<T>
person: Array<{
  name: string;
  age: number;
}>

Câu trả lời #5

Cũ một chút nhưng tôi cảm thấy mình có thể làm rõ điều này hơn.

Câu trả lời chính xác

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

    interface MyExactData {
      [key: string]: MyObject;
    }

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

Nhưng điều trên không phải là cách chúng ta thường làm một mảng các đối tượng, bạn sẽ sử dụng mảng gốc đơn giản trong JavaScript.

    interface MyObject { // define the object (singular)
      id: number;
      name: string;
    }

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

Chỉ cần thêm [] vào giao diện của chúng ta sẽ cung cấp kiểu dữ liệu cho một mảng các đối tượng đó. Và để làm điều đó trực tiếp

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

Tôi sẽ sử dụng giao diện vì bạn có thứ gì đó có thể xác định, dễ hiểu và tái sử dụng. Nếu bạn cần thực hiện thay đổi, bạn có thể thực hiện thay đổi trên một giao diện và TypeScript sẽ báo cáo sự không khớp giữa giao diện của bạn với mã.

Câu trả lời số 6

Điều bạn thực sự muốn có thể chỉ đơn giản là một sự liệt kê

Nếu bạn đang tìm kiếm thứ gì đó hoạt động giống như một kiểu liệt kê (bởi vì tôi thấy bạn đang định nghĩa một đối tượng và gán 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ụ: name so với naaame)), bạn nên định nghĩa một kiểu liệt kê vì ID tuần tự sẽ được xử lý tự động và cung cấp xác minh kiểu dữ liệu cho bạn ngay lập tức.

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 "Available", và bạn có thể truy cập chúng bằng TestStatus.Available. Và Typescript sẽ thực thi loại khi bạn truyền chúng xung quanh.

Nếu bạn nhất quyết định nghĩa một loại mới như 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 với các khóa "0", "1" và "2"), vì vậy hãy định nghĩa kiểu của đối tượng trước, sau đó là kiểu của mảng chứa nó.

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")
]

Bài viết liên quan