توضیح ساده optional properties و optional chaining در تایپ اسکریپت

فروردین, ۱۴۰۴

:? برای Optional Properties

در یک تایپ مثل زیر

type User = {
  name?: string;
  age?: number;
};

:? بعد از property های name و age به این معنی هست که:

این property اختیاری یا آپشنال است.

چرا از :? در optional properties استفاده میکنیم؟

این علامت به typescript اعلام میکند که:

این object ممکن است، این property را داشته باشد یا نه!

پس هر دو object در مثال پایین معتبر هستند.

const user1: User = {
  name: "Ali",
  age: 25,
};

const user2: User = {}; // ✅ also valid because both are optional

در حالیکه بدون علامت :? تمامی property ها الزامی هستند و در هنگام تعریف نمونه ای از object حتما باید شامل این property ها باشد.

type User = {
  name: string;
  age: number;
};

const user: User = {}; // ❌ Error: Property 'name' is missing

.? برای Optional Chaining

روش Optional Chaining .? یک روش ایمن برای دسترسی به property های تو در توی یک object است، بدون اینکه نیاز باشد بررسی کنید آیا null یا undefined هستند یا نه.

چرا از .? در optional chaining استفاده میکنیم؟

بدون Optional Chaining به چیزی شبیه کد پایین نیاز است:

const user = { profile: { name: "Ali" } };

const name = user && user.profile && user.profile.name;

با Optional Chaining کد زیر را داریم:

const name = user?.profile?.name;

در صورت null یا undefined بودن هرکدوم از اجزاء زنجیره بالا اگر از optional chaining استفاده نشود ارور زیر رخ میدهد در نتیجه ممکن است اجرای بخشی از اپلیکیشن با اختلال مواجه شود:

TypeError: Cannot read properties of undefined

خلاصه

  • :? در تایپ ها property رو اختیاری می کند.
  • .? در زنجیره ها (chain)، زمانیکه مطمئن نیستیم property ای وجود دارد یا نه از وقوع ارور جلوگیری میکند.

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

فهرست