Khi nào nên sử dụng Giao diện và Mô hình trong TypeScript / Angular2

Gần đây tôi đã xem Hướng dẫn về Angular 2 với TypeScript, nhưng không biết khi nào nên sử dụng Giao diện và khi nào nên sử dụng Mô hình để giữ cấu trúc dữ liệu.

Ví dụ về giao diện:

export interface IProduct {
    ProductNumber: number;
    ProductName: string;
    ProductDescription: string;
}

Ví dụ về mô hình:

export class Product {
    constructor(
        public ProductNumber: number,
        public ProductName: string,
        public ProductDescription: string
    ){}
}

Tôi muốn tải dữ liệu JSON từ một URL và liên kết với Giao diện / Mô hình. Thỉnh thoảng tôi muốn một đối tượng dữ liệu, lần khác tôi muốn giữ và mảng của đối tượng.

Tôi nên sử dụng cái nào và tại sao?

Giao diện chỉ ở thời gian biên dịch. Điều này chỉ cho phép bạn kiểm tra xem dữ liệu dự kiến ​​nhận được theo một cấu trúc cụ thể. Đối với điều này, bạn có thể truyền nội dung của bạn lên giao diện này:

this.http.get('...')
    .map(res => <Product[]>res.json());

Xem những câu hỏi sau:

• Làm cách nào để tôi truyền một đối tượng JSON đến một lớp bản thảo
• Cách nhận đối tượng Date từ json Phản hồi trong bản thảo

Bạn có thể làm một cái gì đó tương tự với lớp nhưng sự khác biệt chính với lớp là chúng có mặt trong thời gian chạy (hàm tạo) và bạn có thể định nghĩa các phương thức trong chúng bằng cách xử lý. Nhưng, trong trường hợp này, bạn cần khởi tạo các đối tượng để có thể sử dụng chúng:

this.http.get('...')
    .map(res => {
      var data = res.json();
      return data.map(d => {
        return new Product(d.productNumber,
          d.productName, d.productDescription);
      });
    });

Các giao diện mô tả hoặc là một hợp đồng cho một lớp hoặc một mới loại . Nó là một phần tử typecript thuần túy, vì vậy nó không ảnh hưởng đến Javascript.

Một mô hình, và cụ thể là một lớp , là một hàm JS thực tế đang được sử dụng để tạo các đối tượng mới.

Tôi muốn tải dữ liệu JSON từ một URL và liên kết với Giao diện / Mô hình.

Đi cho một mô hình, nếu không nó sẽ vẫn là JSON trong Javascript của bạn.

Như @ThierryTemplier đã nói để nhận dữ liệu từ máy chủ và cũng truyền mô hình giữa các thành phần (để giữ danh sách intellisense và gây ra lỗi thời gian thiết kế), tôi sử dụng giao diện nhưng tôi nghĩ nên gửi dữ liệu đến máy chủ (DTOs) lợi thế của tự động ánh xạ DTO từ mô hình.

Sử dụng Class thay vì Giao diện là những gì tôi đã khám phá sau tất cả các nghiên cứu của mình.

Tại sao? Một lớp một mình là ít mã hơn một giao diện lớp cộng. (dù sao bạn có thể yêu cầu Class cho mô hình dữ liệu)

Tại sao? Một lớp có thể hoạt động như một giao diện (sử dụng thực hiện thay vì mở rộng).

Tại sao? Một lớp giao diện có thể là mã thông báo tra cứu nhà cung cấp trong phép tiêm phụ thuộc Angular.

từ Hướng dẫn phong cách góc cạnh

Về cơ bản, một Class có thể làm tất cả, giao diện sẽ làm gì. Vì vậy, có thể không bao giờ cần phải sử dụng một Giao diện .