بیایید با یک مثال شروع کنیم. تصور کنید در حال توسعه یک اپلیکیشن با نقش های کاربری زیاد هستید. بسیار معمول است که یک برنامه توسط کاربران مختلف مصرف شود، اینطور نیست؟ نقشهای دقیق در اینجا واقعاً مهم نیستند، اما فرض کنید admin
، consumer
و guest
هستند. در تایپ اسکریپت، میتوانیم کاربرانی که این نقشها را دارند به صورت زیر اعلام کنیم:
type Admin = {} type Consumer = {} type Guest = {}
حال، بیایید مجموعهای از ویژگیها را در نظر بگیریم که هر نقش کاربر دارد. معمولاً آنها email
، firstName
و lastName
یا چیزی شبیه به آن هستند. اما، صبر کنید، کاربران Guest
احتمالاً آنها را نخواهند داشت (در نهایت آنها مهمان هستند)، بنابراین اجازه دهید فعلاً این نوع را خالی بگذاریم.
type Admin = { firstName: string lastName: string email: string } type Consumer = { firstName: string lastName: string email: string } type Guest = {}
کاربر یک برنامه فقط می تواند یک نقش داشته باشد. راه برای نشان دادن این از طریق انواع استفاده از نوع union
است.
type User = Admin | Consumer | Guest
type Admin = { firstName: string lastName: string email: string numberOfInvitesLeft: number // <-- added }
برای جالبتر کردن و نزدیکتر کردن موارد به یک برنامه واقعی، اجازه دهید یک ملک منحصر به فرد به نوع Consumer
اضافه کنیم.
type Consumer = { firstName: string lastName: string email: string premium: boolean // <-- added }
const doSomethingBasedOnRole = (user: User) => { // how do you check here that user is really an admin if (user) { // ...and do something with the `numberOfInvitesLeft` property? } }
const doSomethingBasedOnRole = (user: User) => { if (user && user.numberOfInvitesLeft) { // safely access `numberOfInvitesLeft` property } }
type Admin = { firstName: string lastName: string email: string numberOfInvitesLeft: number role: "admin" // <-- added } type Consumer = { firstName: string lastName: string email: string role: "consumer" // <-- added } type Guest = { role: "guest" // <-- added }
توجه کنید که چگونه یک رشته خاص را به عنوان یک نوع قرار می دهم. این نوع تحت اللفظی رشته ای نامیده می شود. چیزی که این به شما می دهد این است که اکنون می توانید از عملگرهای زبان بومی JS، به عنوان مثال، switch case
, if
, else
برای تبعیض در نقش استفاده کنید.
const user: Admin = { firstName: "John", lastName: "Smith", email: "[email protected]", numberOfInvitesLeft: 3, role: "admin", } const doSomethingBasedOnRole = (user: User) => { if (user.role === "admin") { // now typescript knows that INSIDE of this block user is of type `Admin` // now you can safely call `user.numberOfInvitesLeft` within this block } }
// ... const doSomethingBasedOnRole = (user: User) => { switch (user.role) { case "admin": { // now typescript knows that INSIDE of this block user is of type `Admin` // now you can safely call `user.numberOfInvitesLeft` within this block } case "consumer": { // do something with a `Consumer` user // if you try to call `user.numberOfInvitesLeft` here, TS compiler errors in // // "Property 'numberOfInvitesLeft' does not exist on type 'Consumer'." // } } }