ટાઇપસ્ક્રિપ્ટ Infer માં નિપુણતા: એડવાન્સ્ડ ટાઇપ મેનીપ્યુલેશન માટે કન્ડિશનલ ટાઇપ એક્સટ્રેક્શન

ટાઇપસ્ક્રિપ્ટની ટાઇપ સિસ્ટમ અત્યંત શક્તિશાળી છે, જે ડેવલપર્સને મજબૂત અને જાળવણીક્ષમ એપ્લિકેશન્સ બનાવવાની મંજૂરી આપે છે. આ શક્તિને સક્ષમ બનાવતી મુખ્ય સુવિધાઓમાંની એક કન્ડિશનલ ટાઇપ્સ સાથે વપરાતો infer કીવર્ડ છે. આ સંયોજન જટિલ ટાઇપ સ્ટ્રક્ચર્સમાંથી વિશિષ્ટ ટાઇપ્સ કાઢવા માટે એક પદ્ધતિ પ્રદાન કરે છે. આ બ્લોગ પોસ્ટ infer કીવર્ડમાં ઊંડાણપૂર્વક ઉતરે છે, તેની કાર્યક્ષમતા સમજાવે છે અને એડવાન્સ્ડ ઉપયોગો દર્શાવે છે. અમે API ઇન્ટરેક્શનથી લઈને જટિલ ડેટા સ્ટ્રક્ચર મેનીપ્યુલેશન સુધી, વિવિધ સોફ્ટવેર ડેવલપમેન્ટ દૃશ્યોને લાગુ પડતા વ્યવહારુ ઉદાહરણોનું અન્વેષણ કરીશું.

કન્ડિશનલ ટાઇપ્સ શું છે?

આપણે infer વિશે ઊંડાણપૂર્વક શીખીએ તે પહેલાં, ચાલો કન્ડિશનલ ટાઇપ્સની ઝડપથી સમીક્ષા કરીએ. ટાઇપસ્ક્રિપ્ટમાં કન્ડિશનલ ટાઇપ્સ તમને જાવાસ્ક્રિપ્ટમાં ટર્નરી ઓપરેટરની જેમ, એક શરતના આધારે ટાઇપ વ્યાખ્યાયિત કરવાની મંજૂરી આપે છે. તેની મૂળભૂત સિન્ટેક્સ છે:

T extends U ? X : Y

આનો અર્થ છે: "જો ટાઇપ T એ ટાઇપ U ને અસાઇન કરી શકાય છે, તો ટાઇપ X હશે; અન્યથા, ટાઇપ Y હશે."

ઉદાહરણ:

type IsString<T> = T extends string ? true : false;

type StringResult = IsString<string>; // ટાઇપ StringResult = true
type NumberResult = IsString<number>; // ટાઇપ NumberResult = false

infer કીવર્ડનો પરિચય

infer કીવર્ડનો ઉપયોગ કન્ડિશનલ ટાઇપના extends ક્લોઝમાં એક ટાઇપ વેરિયેબલ જાહેર કરવા માટે થાય છે જે તપાસવામાં આવતા ટાઇપમાંથી infer (અનુમાન) કરી શકાય છે. મૂળભૂત રીતે, તે તમને પછીના ઉપયોગ માટે ટાઇપના એક ભાગને "કેપ્ચર" કરવાની મંજૂરી આપે છે.

મૂળભૂત સિન્ટેક્સ:

type MyType<T> = T extends (infer U) ? U : never;

આ ઉદાહરણમાં, જો T કોઈ ટાઇપને અસાઇન કરી શકાય છે, તો ટાઇપસ્ક્રિપ્ટ U ના ટાઇપનું અનુમાન કરવાનો પ્રયાસ કરશે. જો અનુમાન સફળ થાય, તો ટાઇપ U હશે; અન્યથા, તે never હશે.

infer ના સરળ ઉદાહરણો

૧. ફંક્શનના રિટર્ન ટાઇપને Infer કરવું

એક સામાન્ય ઉપયોગ ફંક્શનના રિટર્ન ટાઇપને infer કરવાનો છે:

type ReturnType<T extends (...args: any) => any> = T extends (...args: any) => infer R ? R : any;

function add(a: number, b: number): number {
  return a + b;
}

type AddReturnType = ReturnType<typeof add>; // ટાઇપ AddReturnType = number

function greet(name: string): string {
  return `Hello, ${name}!`;
}

type GreetReturnType = ReturnType<typeof greet>; // ટાઇપ GreetReturnType = string

આ ઉદાહરણમાં, ReturnType<T> ઇનપુટ તરીકે ફંક્શન ટાઇપ T લે છે. તે તપાસે છે કે T એવા ફંક્શનને અસાઇન કરી શકાય છે કે જે કોઈપણ આર્ગ્યુમેન્ટ્સ સ્વીકારે છે અને વેલ્યુ રિટર્ન કરે છે. જો તે હોય, તો તે રિટર્ન ટાઇપને R તરીકે infer કરે છે અને તેને રિટર્ન કરે છે. અન્યથા, તે any રિટર્ન કરે છે.

૨. એરેના એલિમેન્ટ ટાઇપને Infer કરવું

બીજો ઉપયોગી કિસ્સો એરેમાંથી એલિમેન્ટ ટાઇપ કાઢવાનો છે:

type ArrayElementType<T> = T extends (infer U)[] ? U : never;

type NumberArrayType = ArrayElementType<number[]>; // ટાઇપ NumberArrayType = number
type StringArrayType = ArrayElementType<string[]>; // ટાઇપ StringArrayType = string
type MixedArrayType = ArrayElementType<(string | number)[]>; // ટાઇપ MixedArrayType = string | number
type NotAnArrayType = ArrayElementType<number>; // ટાઇપ NotAnArrayType = never

અહીં, ArrayElementType<T> તપાસે છે કે T એરે ટાઇપ છે કે નહીં. જો તે હોય, તો તે એલિમેન્ટ ટાઇપને U તરીકે infer કરે છે અને તેને રિટર્ન કરે છે. જો નહીં, તો તે never રિટર્ન કરે છે.

infer ના એડવાન્સ્ડ ઉપયોગો

૧. કન્સ્ટ્રક્ટરના પેરામીટર્સને Infer કરવું

તમે કન્સ્ટ્રક્ટર ફંક્શનના પેરામીટર ટાઇપ્સને કાઢવા માટે infer નો ઉપયોગ કરી શકો છો:

type ConstructorParameters<T extends new (...args: any) => any> = T extends new (...args: infer P) => any ? P : never;

class Person {
  constructor(public name: string, public age: number) {}
}

type PersonConstructorParams = ConstructorParameters<typeof Person>; // ટાઇપ PersonConstructorParams = [string, number]

class Point {
    constructor(public x: number, public y: number) {}
}

type PointConstructorParams = ConstructorParameters<typeof Point>; // ટાઇપ PointConstructorParams = [number, number]

આ કિસ્સામાં, ConstructorParameters<T> કન્સ્ટ્રક્ટર ફંક્શન ટાઇપ T લે છે. તે કન્સ્ટ્રક્ટર પેરામીટર્સના ટાઇપ્સને P તરીકે infer કરે છે અને તેમને ટપલ તરીકે રિટર્ન કરે છે.

૨. ઓબ્જેક્ટ ટાઇપ્સમાંથી પ્રોપર્ટીઝ એક્સટ્રેક્ટ કરવી

infer નો ઉપયોગ મેપ્ડ ટાઇપ્સ અને કન્ડિશનલ ટાઇપ્સનો ઉપયોગ કરીને ઓબ્જેક્ટ ટાઇપ્સમાંથી વિશિષ્ટ પ્રોપર્ટીઝ કાઢવા માટે પણ કરી શકાય છે:

type PickByType<T, K extends keyof T, U> = {
  [P in K as T[P] extends U ? P : never]: T[P];
};

interface User {
  id: number;
  name: string;
  age: number;
  email: string;
  isActive: boolean;
}

type StringProperties = PickByType<User, keyof User, string>; // ટાઇપ StringProperties = { name: string; email: string; }

type NumberProperties = PickByType<User, keyof User, number>; // ટાઇપ NumberProperties = { id: number; age: number; }

//ભૌગોલિક કોઓર્ડિનેટ્સનું પ્રતિનિધિત્વ કરતું એક ઇન્ટરફેસ.
interface GeoCoordinates {
    latitude: number;
    longitude: number;
    altitude: number;
    country: string;
    city: string;
    timezone: string;
}

type NumberCoordinateProperties = PickByType<GeoCoordinates, keyof GeoCoordinates, number>; // ટાઇપ NumberCoordinateProperties = { latitude: number; longitude: number; altitude: number; }

અહીં, PickByType<T, K, U> એક નવો ટાઇપ બનાવે છે જેમાં ફક્ત T ની તે પ્રોપર્ટીઝ શામેલ હોય છે (જેની કીઝ K માં હોય) જેની વેલ્યુઝ U ટાઇપને અસાઇન કરી શકાય છે. મેપ્ડ ટાઇપ T ની કીઝ પર પુનરાવર્તન કરે છે, અને કન્ડિશનલ ટાઇપ તે કીઝને ફિલ્ટર કરે છે જે ઉલ્લેખિત ટાઇપ સાથે મેળ ખાતી નથી.

૩. Promises સાથે કામ કરવું

તમે Promise ના રિઝોલ્વ્ડ ટાઇપને infer કરી શકો છો:

type Awaited<T> = T extends Promise<infer U> ? U : T;

async function fetchData(): Promise<string> {
  return 'Data from API';
}

type FetchDataType = Awaited<ReturnType<typeof fetchData>>; // ટાઇપ FetchDataType = string

async function fetchNumbers(): Promise<number[]> {
    return [1, 2, 3];
}

type FetchedNumbersType = Awaited<ReturnType<typeof fetchNumbers>>; //ટાઇપ FetchedNumbersType = number[]

Awaited<T> ટાઇપ T લે છે, જે એક પ્રોમિસ હોવાની અપેક્ષા છે. પછી ટાઇપ પ્રોમિસના રિઝોલ્વ્ડ ટાઇપ U ને infer કરે છે, અને તેને રિટર્ન કરે છે. જો T પ્રોમિસ ન હોય, તો તે T રિટર્ન કરે છે. આ ટાઇપસ્ક્રિપ્ટના નવા વર્ઝનમાં એક બિલ્ટ-ઇન યુટિલિટી ટાઇપ છે.

૪. Promises ના એરેના ટાઇપને એક્સટ્રેક્ટ કરવું

Awaited અને એરે ટાઇપ ઇન્ફરન્સને જોડીને તમે Promises ના એરે દ્વારા રિઝોલ્વ થયેલ ટાઇપને infer કરી શકો છો. આ ખાસ કરીને Promise.all સાથે કામ કરતી વખતે ઉપયોગી છે.

type PromiseArrayReturnType<T extends Promise<any>[]> = {
    [K in keyof T]: Awaited<T[K]>;
};


async function getUSDRate(): Promise<number> {
  return 0.0069;
}

async function getEURRate(): Promise<number> {
  return 0.0064;
}

const rates = [getUSDRate(), getEURRate()];

type RatesType = PromiseArrayReturnType<typeof rates>;
// ટાઇપ RatesType = [number, number]

આ ઉદાહરણ પ્રથમ બે અસિંક્રોનસ ફંક્શન્સ, getUSDRate અને getEURRate વ્યાખ્યાયિત કરે છે, જે એક્સચેન્જ રેટ્સ મેળવવાનું અનુકરણ કરે છે. PromiseArrayReturnType યુટિલિટી ટાઇપ પછી એરેમાંના દરેક Promise માંથી રિઝોલ્વ્ડ ટાઇપને કાઢે છે, પરિણામે એક ટપલ ટાઇપ બને છે જ્યાં દરેક એલિમેન્ટ સંબંધિત પ્રોમિસનો awaited ટાઇપ હોય છે.

વિવિધ ડોમેન્સમાં વ્યવહારુ ઉદાહરણો

૧. ઈ-કોમર્સ એપ્લિકેશન

એક ઈ-કોમર્સ એપ્લિકેશનનો વિચાર કરો જ્યાં તમે API માંથી પ્રોડક્ટની વિગતો મેળવો છો. તમે પ્રોડક્ટ ડેટાનો ટાઇપ કાઢવા માટે infer નો ઉપયોગ કરી શકો છો:

interface Product {
  id: number;
  name: string;
  price: number;
  description: string;
  imageUrl: string;
  category: string;
  rating: number;
  countryOfOrigin: string;
}

async function fetchProduct(productId: number): Promise<Product> {
  // API કૉલનું અનુકરણ કરો
  return new Promise((resolve) => {
    setTimeout(() => {
      resolve({
        id: productId,
        name: 'Example Product',
        price: 29.99,
        description: 'A sample product',
        imageUrl: 'https://example.com/image.jpg',
        category: 'Electronics',
        rating: 4.5,
        countryOfOrigin: 'Canada'
      });
    }, 500);
  });
}


type ProductType = Awaited<ReturnType<typeof fetchProduct>>; // ટાઇપ ProductType = Product

function displayProductDetails(product: ProductType) {
  console.log(`પ્રોડક્ટનું નામ: ${product.name}`);
  console.log(`કિંમત: ${product.price} ${product.countryOfOrigin === 'Canada' ? 'CAD' : (product.countryOfOrigin === 'USA' ? 'USD' : 'EUR')}`);
}

fetchProduct(123).then(displayProductDetails);

આ ઉદાહરણમાં, અમે Product ઇન્ટરફેસ અને fetchProduct ફંક્શન વ્યાખ્યાયિત કરીએ છીએ જે API માંથી પ્રોડક્ટની વિગતો મેળવે છે. અમે fetchProduct ફંક્શનના રિટર્ન ટાઇપમાંથી Product ટાઇપને કાઢવા માટે Awaited અને ReturnType નો ઉપયોગ કરીએ છીએ, જે અમને displayProductDetails ફંક્શનને ટાઇપ-ચેક કરવાની મંજૂરી આપે છે.

૨. આંતરરાષ્ટ્રીયકરણ (i18n)

ધારો કે તમારી પાસે એક ટ્રાન્સલેશન ફંક્શન છે જે લોકેલના આધારે જુદી જુદી સ્ટ્રિંગ્સ રિટર્ન કરે છે. તમે ટાઇપ સેફ્ટી માટે આ ફંક્શનના રિટર્ન ટાઇપને કાઢવા માટે infer નો ઉપયોગ કરી શકો છો:

interface Translations {
  greeting: string;
  farewell: string;
  welcomeMessage: (name: string) => string;
}

const enTranslations: Translations = {
  greeting: 'Hello',
  farewell: 'Goodbye',
  welcomeMessage: (name: string) => `Welcome, ${name}!`,
};

const frTranslations: Translations = {
  greeting: 'Bonjour',
  farewell: 'Au revoir',
  welcomeMessage: (name: string) => `Bienvenue, ${name}!`,
};

function getTranslation(locale: 'en' | 'fr'): Translations {
  return locale === 'en' ? enTranslations : frTranslations;
}

type TranslationType = ReturnType<typeof getTranslation>;

function greetUser(locale: 'en' | 'fr', name: string) {
  const translations = getTranslation(locale);
  console.log(translations.welcomeMessage(name));
}

greetUser('fr', 'Jean'); // આઉટપુટ: Bienvenue, Jean!

અહીં, TranslationType ને Translations ઇન્ટરફેસ તરીકે infer કરવામાં આવે છે, જે ખાતરી કરે છે કે greetUser ફંક્શન પાસે ટ્રાન્સલેટેડ સ્ટ્રિંગ્સને એક્સેસ કરવા માટે સાચી ટાઇપ માહિતી છે.

૩. API રિસ્પોન્સ હેન્ડલિંગ

APIs સાથે કામ કરતી વખતે, રિસ્પોન્સ સ્ટ્રક્ચર જટિલ હોઈ શકે છે. infer નેસ્ટેડ API રિસ્પોન્સમાંથી વિશિષ્ટ ડેટા ટાઇપ્સ કાઢવામાં મદદ કરી શકે છે:

interface ApiResponse<T> {
  status: number;
  data: T;
  message?: string;
}

interface UserData {
  id: number;
  username: string;
  email: string;
  profile: {
    firstName: string;
    lastName: string;
    country: string;
    language: string;
  }
}

async function fetchUser(userId: number): Promise<ApiResponse<UserData>> {
  // API કૉલનું અનુકરણ કરો
  return new Promise((resolve) => {
    setTimeout(() => {
      resolve({
        status: 200,
        data: {
          id: userId,
          username: 'johndoe',
          email: 'john.doe@example.com',
          profile: {
            firstName: 'John',
            lastName: 'Doe',
            country: 'USA',
            language: 'en'
          }
        }
      });
    }, 500);
  });
}


type UserApiResponse = Awaited<ReturnType<typeof fetchUser>>;

type UserProfileType = UserApiResponse['data']['profile'];

function displayUserProfile(profile: UserProfileType) {
  console.log(`નામ: ${profile.firstName} ${profile.lastName}`);
  console.log(`દેશ: ${profile.country}`);
}

fetchUser(123).then((response) => {
  if (response.status === 200) {
    displayUserProfile(response.data.profile);
  }
});

આ ઉદાહરણમાં, અમે ApiResponse ઇન્ટરફેસ અને UserData ઇન્ટરફેસ વ્યાખ્યાયિત કરીએ છીએ. અમે API રિસ્પોન્સમાંથી UserProfileType કાઢવા માટે infer અને ટાઇપ ઇન્ડેક્સિંગનો ઉપયોગ કરીએ છીએ, જે ખાતરી કરે છે કે displayUserProfile ફંક્શનને સાચો ટાઇપ મળે છે.

infer નો ઉપયોગ કરવા માટેની શ્રેષ્ઠ પદ્ધતિઓ

• તેને સરળ રાખો: infer નો ઉપયોગ ફક્ત ત્યારે જ કરો જ્યારે જરૂરી હોય. તેનો વધુ પડતો ઉપયોગ તમારા કોડને વાંચવા અને સમજવામાં મુશ્કેલ બનાવી શકે છે.
• તમારા ટાઇપ્સને ડોક્યુમેન્ટ કરો: તમારા કન્ડિશનલ ટાઇપ્સ અને infer સ્ટેટમેન્ટ્સ શું કરી રહ્યા છે તે સમજાવવા માટે કોમેન્ટ્સ ઉમેરો.
• તમારા ટાઇપ્સનું પરીક્ષણ કરો: તમારા ટાઇપ્સ અપેક્ષા મુજબ વર્તી રહ્યા છે તેની ખાતરી કરવા માટે ટાઇપસ્ક્રિપ્ટના ટાઇપ ચેકિંગનો ઉપયોગ કરો.
• પર્ફોર્મન્સને ધ્યાનમાં લો: જટિલ કન્ડિશનલ ટાઇપ્સ ક્યારેક કમ્પાઇલેશન સમયને અસર કરી શકે છે. તમારા ટાઇપ્સની જટિલતા પ્રત્યે સજાગ રહો.
• યુટિલિટી ટાઇપ્સનો ઉપયોગ કરો: ટાઇપસ્ક્રિપ્ટ ઘણા બિલ્ટ-ઇન યુટિલિટી ટાઇપ્સ (દા.ત., ReturnType, Awaited) પ્રદાન કરે છે જે તમારા કોડને સરળ બનાવી શકે છે અને કસ્ટમ infer સ્ટેટમેન્ટ્સની જરૂરિયાત ઘટાડી શકે છે.

સામાન્ય ભૂલો

• ખોટું અનુમાન: ક્યારેક, ટાઇપસ્ક્રિપ્ટ એવા ટાઇપનું અનુમાન કરી શકે છે જે તમારી અપેક્ષા મુજબ ન હોય. તમારા ટાઇપ વ્યાખ્યાઓ અને શરતોને બે વાર તપાસો.
• ચક્રીય નિર્ભરતા: infer નો ઉપયોગ કરીને રિકર્સિવ ટાઇપ્સ વ્યાખ્યાયિત કરતી વખતે સાવચેત રહો, કારણ કે તે ચક્રીય નિર્ભરતા અને કમ્પાઇલેશન ભૂલો તરફ દોરી શકે છે.
• અતિશય જટિલ ટાઇપ્સ: અતિશય જટિલ કન્ડિશનલ ટાઇપ્સ બનાવવાનું ટાળો જે સમજવા અને જાળવવા મુશ્કેલ હોય. તેમને નાના, વધુ વ્યવસ્થાપિત ટાઇપ્સમાં વિભાજીત કરો.

infer ના વિકલ્પો

જ્યારે infer એક શક્તિશાળી સાધન છે, ત્યારે એવી પરિસ્થિતિઓ છે જ્યાં વૈકલ્પિક અભિગમો વધુ યોગ્ય હોઈ શકે છે:

• ટાઇપ એસર્શન્સ: કેટલાક કિસ્સાઓમાં, તમે મૂલ્યના ટાઇપને અનુમાન કરવાને બદલે સ્પષ્ટપણે ઉલ્લેખિત કરવા માટે ટાઇપ એસર્શન્સનો ઉપયોગ કરી શકો છો. જોકે, ટાઇપ એસર્શન્સ સાથે સાવચેત રહો, કારણ કે તે ટાઇપ ચેકિંગને બાયપાસ કરી શકે છે.
• ટાઇપ ગાર્ડ્સ: રનટાઇમ તપાસના આધારે મૂલ્યના ટાઇપને સંકુચિત કરવા માટે ટાઇપ ગાર્ડ્સનો ઉપયોગ કરી શકાય છે. જ્યારે તમારે રનટાઇમ શરતોના આધારે વિવિધ ટાઇપ્સને હેન્ડલ કરવાની જરૂર હોય ત્યારે આ ઉપયોગી છે.
• યુટિલિટી ટાઇપ્સ: ટાઇપસ્ક્રિપ્ટ યુટિલિટી ટાઇપ્સનો સમૃદ્ધ સેટ પ્રદાન કરે છે જે કસ્ટમ infer સ્ટેટમેન્ટ્સની જરૂરિયાત વિના ઘણા સામાન્ય ટાઇપ મેનીપ્યુલેશન કાર્યોને સંભાળી શકે છે.

નિષ્કર્ષ

ટાઇપસ્ક્રિપ્ટમાં infer કીવર્ડ, જ્યારે કન્ડિશનલ ટાઇપ્સ સાથે જોડવામાં આવે છે, ત્યારે એડવાન્સ્ડ ટાઇપ મેનીપ્યુલેશન ક્ષમતાઓને અનલૉક કરે છે. તે તમને જટિલ ટાઇપ સ્ટ્રક્ચર્સમાંથી વિશિષ્ટ ટાઇપ્સ કાઢવાની મંજૂરી આપે છે, જે તમને વધુ મજબૂત, જાળવણીક્ષમ અને ટાઇપ-સેફ કોડ લખવા માટે સક્ષમ બનાવે છે. ફંક્શન રિટર્ન ટાઇપ્સને infer કરવાથી લઈને ઓબ્જેક્ટ ટાઇપ્સમાંથી પ્રોપર્ટીઝ કાઢવા સુધી, શક્યતાઓ વિશાળ છે. આ માર્ગદર્શિકામાં દર્શાવેલ સિદ્ધાંતો અને શ્રેષ્ઠ પદ્ધતિઓને સમજીને, તમે infer નો તેની સંપૂર્ણ ક્ષમતા સુધી લાભ લઈ શકો છો અને તમારી ટાઇપસ્ક્રિપ્ટ કુશળતાને વધારી શકો છો. તમારા ટાઇપ્સને ડોક્યુમેન્ટ કરવાનું યાદ રાખો, તેમને સંપૂર્ણ રીતે પરીક્ષણ કરો, અને જ્યારે યોગ્ય હોય ત્યારે વૈકલ્પિક અભિગમોનો વિચાર કરો. infer માં નિપુણતા મેળવવી તમને ખરેખર અર્થસભર અને શક્તિશાળી ટાઇપસ્ક્રિપ્ટ કોડ લખવા માટે સશક્ત બનાવે છે, જે આખરે વધુ સારા સોફ્ટવેર તરફ દોરી જાય છે.