چگونه می توان از TypeScript بیشترین بهره را برد

عکس پروفایل نویسنده

من عاشق TypeScript هستم. من بیش از 2 سال است که از آن در پروژه های مختلف استفاده می کنم ، و هرچه بیشتر از آن استفاده کنم جذابتر وانیل Javascript را پیدا می کنم.

نه اینکه وانیل Javascript مشکلی ندارد (وبلاگ من وانیل است!) ، اما فکر می کنم وقتی صحبت از پروژه های متوسط ​​تا بزرگ می شود ، Typescript بسیاری از کارها را آسان می کند.

در میان بسیاری از چیزهای خوب Typescript ، من می خواهم به یکی از مواردی بپردازم که ، طبق تجربه من ، باعث شده است اشکالات زیادی برای من کم شود.

ابتدا با یک مثال شروع می کنیم.

این کد شامل اجزای React خواهد بود ، اما اصل کلی با سایر فریم ورک ها نیز ثابت است.

بیایید بگوییم که ما در برنامه خود یک شاخص بارگیری ابتدایی داریم:

import React from "react";

type RequestStatus = "PENDING" | "SUCCESSFUL" | "FAILED";

interface RequestLoadingIndicatorProps {
  state: RequestStatus;
}

const styles: Record = {
  PENDING: {
    backgroundColor: "blue",
    borderRadius: "50%",
    width: "50px",
    height: "50px",
  },
  FAILED: {
    backgroundColor: "red",
    borderRadius: "50%",
    width: "50px",
    height: "50px",
  },
  SUCCESSFUL: {
    backgroundColor: "green",
    borderRadius: "50%",
    width: "50px",
    height: "50px",
  },
};

export const RequestLoadingIndicator: React.FC = ({
  state,
}) = {
  return 
; };

در اینجا به نظر می رسد: