Tạo type key từ object

Muốn lấy chỉ key từ object

Giả sử có message được định nghĩa theo từng ngôn ngữ.

ts
const conf = {
  en: "Are you sure?",
  fr: "Êtes-vous sûr?",
  es: "Está seguro?",
  ja: "よろしいですか？",
  zh: "您确定吗？",
};

ts
const conf = {
  en: "Are you sure?",
  fr: "Êtes-vous sûr?",
  es: "Está seguro?",
  ja: "よろしいですか？",
  zh: "您确定吗？",
};

Nội dung là message hệ thống bình thường để xác nhận. Sử dụng object này để tạo danh sách các ngôn ngữ hệ thống hỗ trợ. Union type sau là mục tiêu lần này.

ts
type Language = "en" | "fr" | "es" | "ja" | "zh";

ts
type Language = "en" | "fr" | "es" | "ja" | "zh";

typeof

typeof xuất hiện thường xuyên này không phải của JavaScript, mà là typeof của TypeScript. Ví dụ sử dụng nó với object có ở trang trước.

📄️ Tạo type từ object

Trong nhiều ngôn ngữ, coding bắt đầu bằng việc định nghĩa struct, object bằng type, nhưng TypeScript có nguồn gốc từ JavaScript nên thường không có quy định như vậy.

Nếu thực thi với ví dụ này, type TypeOfLanguage như sau sẽ được tạo (tên type chỉ là cho tiện).

ts
type TypeOfLanguage = typeof conf;
           
type TypeOfLanguage = {
    en: string;
    fr: string;
    es: string;
    ja: string;
    zh: string;
}

ts
type TypeOfLanguage = typeof conf;
           
type TypeOfLanguage = {
    en: string;
    fr: string;
    es: string;
    ja: string;
    zh: string;
}

Đến đây thì chỉ còn một chút nữa. Chỉ biến key của type TypeOfLanguage thành type.

keyof

keyof khi sử dụng với type của object sẽ trả về key của object đó dưới dạng union type. Nếu có type TypeOfLanguage ở trên

ts
type Language = keyof TypeOfLanguage;
        
type Language = "en" | "fr" | "es" | "ja" | "zh"

ts
type Language = keyof TypeOfLanguage;
        
type Language = "en" | "fr" | "es" | "ja" | "zh"

sẽ được như vậy.

📄️ keyof type operator

keyof là type operator trả về tên các property của một object type dưới dạng kiểu. Ví dụ, khi sử dụng keyof với một kiểu có property name, bạn sẽ nhận được string literal type "name".

Tóm tắt

Mặc dù trông hơi kỳ lạ, nhưng có thể tạo union type của key mong muốn từ object bằng cách sau.

ts
type Language = keyof typeof conf;
        
type Language = "en" | "fr" | "es" | "ja" | "zh"

ts
type Language = keyof typeof conf;
        
type Language = "en" | "fr" | "es" | "ja" | "zh"

Câu hỏi: keyof conf không được sao?

Không hoạt động. Vì keyof có thể sử dụng với type (của object) chứ không phải value. Mặt khác typeof tạo type từ value nên cần sử dụng theo thứ tự này.