معرفی
سلام، من haruhikonyan هستم و مدتی است که روی WESEEK کار می کنم.
آیا از TypeScript استفاده می کنید؟
شما می توانید نه تنها کدهای فرانت اند، بلکه کدهای سمت سرور را با Node بنویسید، و همچنین تایپ ایمن است!
در این مقاله می‌خواهم با استفاده از عملگر “is” که یکی از محافظ‌های نوع تعریف شده توسط کاربر است، یک محافظ نوع خود ساخته را معرفی کنم تا TypeScript قوی‌تر و مفیدتر باشد.
تایپ گارد چیست؟
اول اینکه تایپ گارد چیست؟
شما می توانید مرجع را برای یک مرور کلی بخوانید، اما منبعی که احتمالاً بیشتر از آن استفاده خواهید کرد به شرح زیر است.
همانطور که می بینید، ما اغلب از چک های پوچ و تعریف نشده استفاده می کنیم. البته اغلب لازم است که نه تنها انواع اولیه مانند null، بلکه انواع اصلی تعریف شده توسط کاربر نیز تعیین شوند.
اینجاست که عملگر “is” وارد می شود.
“است” چیست؟
احتمالاً نگاه کردن سریعتر از توضیح دادن آن است، بنابراین ابتدا یک مثال را به شما نشان خواهم داد.
Axios، یکی از پرکاربردترین کتابخانه ها، پیاده سازی ساده ای به نام دارد isAxiosError.
همانطور که در مثال می بینید، تعیین می کند که آیا یک متغیر یک AxiosError است یا نه، و نوع guarding برای محدود کردن نوع متغیر استفاده می شود.
من قصد داشتم آن را همانطور که هست معرفی کنم، اما کد اصلی در جاوا اسکریپت بود، بنابراین آن را در اینجا در TypeScript بازنویسی کردم تا خواندن آن نسبتا آسان باشد.
isObject
این نیز مانند یک محافظ نوع واقعی است. از آنجایی که عملگر “is” استفاده نمی شود، نوع محافظ تایپ را به معنای ترانسپایلری محدود نمی کند، اما تضمین می کند که نوع تهی نیست و از نوع شی با typeof.
isAxiosError
موضوع اصلی اینجاست. ابتدا، بیایید به آنچه در داخل است نگاه کنیم.
و اولین چیز این است که payload یک شی است. این خوبه.
سپس می بینیم که خاصیت آن payload ارزش دارد isAxiosError true.
این همه است.
به نظر می رسد که شی خطای صادر شده توسط Axios همیشه حاوی مقدار است true.
این بدان معناست که اگر تابع isAxiosError برمی گرداند true، به ترانسپایلر TypeScript می گوید که payload به عنوان آرگومان داده شده از نوع (است) است AxiosError.
توضیح بیشتر
موارد بالا تقریباً تمام مواردی است که توضیح داده شده است، اما URL زیر حاوی مشخصات دقیق و کامل تری است، بنابراین اگر شک دارید یا می خواهید بیشتر بدانید، آن را بررسی کنید.
یک تابع برای تعیین آرایه رشته ای ساخته است
امیدوارم همه اکنون اپراتور “is” را درک کنند.
در اینجا، می‌خواهم تابعی را معرفی کنم که زمانی که از TypeScript استفاده می‌کردم ایجاد کردم و می‌خواستم دقیقا بدانم آیا یک متغیر خاص یک آرایه رشته‌ای است یا خیر.
تابع ایجاد شد
اگر توضیحات بالا را خوانده باشید، ممکن است متوجه شوید. توضیح این است که آنچه ما به عنوان دریافت می کنیم value آرایه ای است با isArray، و اگر value تعیین می شود که یک آرایه باشد every تابع به ترانسپایلر می گوید که از نوع خود است string[] اگر همه عناصر آن از نوع باشند string.
در عمل، زمانی که یک پرس و جو از یک درخواست دریافت می شود express، نوع پرس و جو است string | string[] | QueryString.ParsedQs | QueryString.ParsedQs[] | undefined، نوعی که همه احتمالات را در نظر می گیرد.
اگر می خواهید فقط یک string، شما می توانید استفاده کنید typeof، اما اگر می خواهید تعیین کنید string[]، isArray کافی نیست، بنابراین محافظ نوع خود را ایجاد کردم.
مراقب باشید قالب را جعل نکنید
من مطمئن هستم که شما وسوسه شده اید که با استفاده از عملگر “is” دست خود را در تعیین نوع امتحان کنید. با این حال، اگر بنویسید is Hoge در تعریف و تابع حتی true را برمی گرداند، transpiler از قبل می داند که یک نوع Hoge است، بنابراین اگر قضاوت مناسبی بنویسید، نوع نادرست خواهد بود.
این isAxiosError همیشه مناسب نیست، اما اگر یک شی مناسب دارای ویژگی باشد نامیده می شود isAxiosError و true در آنجا تنظیم شده است، فرض می شود که از نوع است AxiosError. هم تعریف عملکرد و هم استفاده از تابع باید از این خطر آگاه باشد.
بیایید یک سیستم امن‌تر و قوی‌تر ایجاد کنیم، بدون اینکه به «مانند» یا «هر کدام» فرار کنیم!
درباره ما💡
علاوه بر این، من می خواهم کمی بیشتر در مورد GROWI، یک نرم افزار باز توسعه یافته توسط ما، معرفی کنم WESEEK, Inc.
GROWI یک سرویس ویکی با پشتیبانی غنی از ویژگی ها برای ذخیره سازی کارآمد اطلاعات در شرکت است. همچنین دارای امنیت بالایی است و روش‌های مختلف احراز هویت برای ساده‌سازی مدیریت احراز هویت از جمله LDAP/OAuth/SAML.
GROWI منشاء آن ژاپن و GROWI OSS است رایگان برای دانلود و استفاده هر کسی به انگلیسی.
برای اطلاعات بیشتر، به GROWI.org بروید تا درباره ما بیشتر بدانید. همچنین می‌توانید فیسبوک ما را دنبال کنید تا به‌روزرسانی‌های سرویس ما را ببینید.
