§

JSON ਸੈਂਪਲ

ਟਾਈਪ ਅਨੁਮਾਨਕਰਤਾ ਤਿਆਰ ਹੋ ਰਿਹਾ ਹੈ…
§

TypeScript ਇੰਟਰਫੇਸ

TypeScript

ਭਾਰਤ ਵਿੱਚ TypeScript ਟੀਮਾਂ ਇਹ ਸਮੱਸਿਆ ਜਲਦੀ ਦੇਖਦੀਆਂ ਹਨ। ਵੱਡੇ SDKs ਟਾਈਪਡ ਕਲਾਇੰਟ ਸ਼ਿਪ ਕਰਦੇ ਹਨ, ਪਰ ਅੰਦਰੂਨੀ ਸੇਵਾਵਾਂ ਅਤੇ ਥਰਡ-ਪਾਰਟੀ ਵੈੱਬਹੁੱਕ ਪੇਲੋਡ ਘੱਟ ਹੀ ਕਰਦੇ ਹਨ। ਆਮ ਵਰਕਫਲੋ ਇਹ ਹੈ: ਨੈੱਟਵਰਕ ਪੈਨਲ ਵਿੱਚ ਅਸਲ ਜਵਾਬ ਕੈਪਚਰ ਕਰੋ, ਇੱਥੇ ਪੇਸਟ ਕਰੋ, ਐਂਡਪੁਆਇੰਟ ਤੋਂ ਬਾਅਦ ਰੂਟ ਦਾ ਨਾਮ ਰੱਖੋ, ਅਤੇ ਆਉਟਪੁੱਟ ਪ੍ਰੋਜੈਕਟ ਦੀ types ਡਾਇਰੈਕਟਰੀ ਵਿੱਚ ਕਾਪੀ ਕਰੋ। ਅਨੁਮਾਨਕਰਤਾ ਪੂਰੀ ਤਰ੍ਹਾਂ ਤੁਹਾਡੇ ਬ੍ਰਾਊਜ਼ਰ ਵਿੱਚ ਚੱਲਦਾ ਹੈ।

JSON-to-TypeScript ਅਨੁਮਾਨ ਕਿਵੇਂ ਕੰਮ ਕਰਦਾ ਹੈ

ਅਨੁਮਾਨ ਪਾਰਸ ਕੀਤੇ JSON ਟ੍ਰੀ ਤੇ ਇੱਕ ਪਾਸ ਹੈ। ਟੂਲ ਹਰ ਮੁੱਲ ਪੜ੍ਹਦਾ ਹੈ, ਇਸਦੇ ਲਈ TypeScript ਕਿਸਮ ਚੁਣਦਾ ਹੈ, ਅਤੇ ਫਿਰ ਹਰ ਆਬਜੈਕਟ ਲਈ ਇੱਕ ਇੰਟਰਫੇਸ ਲਿਖਦਾ ਹੈ।

  1. ਬ੍ਰਾਊਜ਼ਰ ਦੇ ਨੇਟਿਵ ਪਾਰਸਰ ਨਾਲ JSON ਸੈਂਪਲ ਪਾਰਸ ਕਰੋ ਅਤੇ ਖਰਾਬ ਇਨਪੁੱਟ ਲਾਈਨ/ਕਾਲਮ ਸੰਕੇਤ ਨਾਲ ਰੱਦ ਕਰੋ।
  2. ਹਰ ਮੁੱਲ ਲਈ TypeScript ਕਿਸਮ ਸੁੰਘੋ — string, number, boolean, null, ਐਰੇ, ਜਾਂ ਨੈਸਟਡ ਆਬਜੈਕਟ।
  3. ਹਰ ਨੈਸਟਡ ਆਬਜੈਕਟ ਨੂੰ ਇਸਦੀ ਪੇਰੈਂਟ ਪ੍ਰਾਪਰਟੀ ਕੁੰਜੀ ਤੋਂ ਲਿਆ ਇੰਟਰਫੇਸ ਨਾਮ ਦਿਓ (ਇਸ ਲਈ user.address ਇੱਕ Address ਇੰਟਰਫੇਸ ਬਣਦਾ ਹੈ)।
  4. ਹਰ ਐਰੇ ਵਿੱਚ ਆਈਟਮ ਕਿਸਮਾਂ ਮਿਲਾਓ ਤਾਂ ਜੋ {id: 1} ਅਤੇ {id: 2, label: "x"} ਦੀ ਸੂਚੀ ਸਹੀ ਓਪਸ਼ਨਲ ਖੇਤਰਾਂ ਵਾਲਾ ਯੂਨੀਅਨ ਤਿਆਰ ਕਰੇ।
  5. ਆਪਣੇ ਵਿਕਲਪ ਲਾਗੂ ਕਰੋ (interface ਬਨਾਮ type, readonly, optional-nullable) ਅਤੇ ਡਿਪੈਂਡੈਂਸੀ ਕ੍ਰਮ ਵਿੱਚ ਘੋਸ਼ਣਾਵਾਂ ਛੱਡੋ।

JSON ਤੋਂ TypeScript ਕਿਸਮਾਂ ਕਿਉਂ ਬਣਾਓ?

  • ਜ਼ਿਆਦਾਤਰ ਆਕਾਰ ਬੱਗ ਕੰਪਾਈਲ ਸਮੇਂ ਫੜੇ ਜਾ ਸਕਦੇ ਹਨ ਜੇ ਜਵਾਬ ਕਿਸਮ ਲਿਖੀ ਹੋਵੇ। ਅਸਲ ਪੇਲੋਡ ਤੋਂ ਇੰਟਰਫੇਸ ਅਨੁਮਾਨਿਤ ਕਰਨ ਨਾਲ ਜ਼ਿਆਦਾਤਰ ਤੁਹਾਡੇ ਲਈ ਲਿਖੀ ਜਾਂਦੀ ਹੈ।
  • ਅਨੁਮਾਨਿਤ ਇੰਟਰਫੇਸਾਂ ਨੂੰ Zod ਜਾਂ io-ts ਵਰਗੇ ਰਨਟਾਈਮ ਵੈਲੀਡੇਟਰ ਨਾਲ ਜੋੜਨ ਨਾਲ ਇੱਕੋ ਆਕਾਰ ਨੂੰ ਦੋ ਕੰਮ ਮਿਲਦੇ ਹਨ: ਡਿਵੈਲਪਮੈਂਟ ਵਿੱਚ ਐਡੀਟਰ ਆਟੋਕੰਪਲੀਟ ਅਤੇ ਅਣਕਿਆਸੇ ਡੇਟਾ ਤੇ 400 ਗਲਤੀ।
  • TypeScript ਦਾ ਲੈਂਗੂਏਜ ਸਰਵਰ ਸਿਰਫ਼ ਉਹ ਖੇਤਰ ਦਿਖਾਉਂਦਾ ਹੈ ਜੋ ਜਾਣਦਾ ਹੈ। ਇੱਕ ਵਾਰ ਅਨੁਮਾਨਿਤ ਇੰਟਰਫੇਸ ਆਯਾਤ ਕਰੋ, ਆਟੋਕੰਪਲੀਟ ਡੌਟ ਟਾਈਪ ਕਰਦੇ ਹੀ ਕੰਮ ਕਰਦਾ ਹੈ।
  • ਜੇ ਤੁਸੀਂ ਇੱਕ OpenAPI ਸਪੈੱਕ ਲਿਖਣ ਵਾਲੇ ਹੋ, ਤਾਂ ਇੱਕ ਅਨੁਮਾਨਿਤ ਇੰਟਰਫੇਸ ਜਵਾਬ ਸਕੀਮਾ ਦਾ ਇੱਕ ਤੇਜ਼ ਪਹਿਲਾ ਖਰੜਾ ਹੁੰਦਾ ਹੈ। ਤੁਹਾਨੂੰ ਫਿਰ ਵੀ ਹੱਥ ਨਾਲ ਲਿਖੀਆਂ ਉਦਾਹਰਣਾਂ ਅਤੇ ਪਾਬੰਦੀਆਂ ਦੀ ਲੋੜ ਹੋਵੇਗੀ, ਪਰ ਪ੍ਰਾਪਰਟੀ ਨਾਮ ਅਤੇ ਕਿਸਮਾਂ ਪਹਿਲਾਂ ਹੀ ਸਹੀ ਹਨ।

ਆਮ ਵਰਤੋਂ

ਅਨੁਮਾਨ ਉਦੋਂ ਸਭ ਤੋਂ ਵੱਧ ਮਦਦਗਾਰ ਹੁੰਦਾ ਹੈ ਜਦੋਂ ਅਸਲ ਪੇਲੋਡ ਮੌਜੂਦ ਹੋਵੇ ਪਰ ਸਕੀਮਾ ਨਾ ਹੋਵੇ।

  • Stripe, GitHub, ਜਾਂ Twilio ਦੇ ਥਰਡ-ਪਾਰਟੀ ਵੈੱਬਹੁੱਕ ਪੇਲੋਡ ਟਾਈਪ ਕਰਨਾ ਹੈਂਡਲਰ ਲਿਖਣ ਤੋਂ ਪਹਿਲਾਂ।
  • ਅੰਦਰੂਨੀ REST API ਲਈ ਕਿਸਮਾਂ ਬੂਟਸਟ੍ਰੈਪ ਕਰਨਾ ਤਾਂ ਜੋ ਫਰੰਟਐਂਡ ਟੀਮ ਉਸੇ ਦਿਨ ਕੋਡਿੰਗ ਸ਼ੁਰੂ ਕਰ ਸਕੇ।
  • ਦੇਖੇ ਗਏ API ਜਵਾਬ ਤੋਂ Zod, io-ts, ਜਾਂ Valibot ਸਕੀਮਾ ਲਈ ਸ਼ੁਰੂਆਤੀ ਬਿੰਦੂ ਬਣਾਉਣਾ।

ਆਉਟਪੁੱਟ ਕਿਵੇਂ ਦਿਖਦੀ ਹੈ?

ਇੱਕ ਸੈਂਪਲ JSON ਦਸਤਾਵੇਜ਼ ਅਤੇ ਰੂਟ ਨਾਮ ਦਿੱਤੇ, ਜਨਰੇਟਰ ਇੰਟਰਫੇਸਾਂ ਦਾ ਟ੍ਰੀ ਤਿਆਰ ਕਰਦਾ ਹੈ, ਹਰ ਨੈਸਟਡ ਆਬਜੈਕਟ ਲਈ ਇੱਕ। ਰੂਟ ਨਾਮ User ਨਾਲ ਹੇਠਲੇ ਇਨਪੁੱਟ ਲਈ:

{"id":1,"name":"Alice","tags":["a","b"],"address":{"city":"Paris"}} ਰੂਟ ਨਾਮ User ਨਾਲ ਪੇਸਟ ਕਰੋ ਅਤੇ ਜਨਰੇਟਰ ਤਿਆਰ ਕਰਦਾ ਹੈ:

export interface User {
  id: number;
  name: string;
  tags: string[];
  address: Address;
}

export interface Address {
  city: string;
}
ਨੋਟ ਕਰੋ ਕਿ address ਨੂੰ ਆਪਣੇ ਨਾਮਿਤ ਇੰਟਰਫੇਸ ਵਿੱਚ ਉੱਚਾ ਕੀਤਾ ਗਿਆ — ਇਹ ਡਿਪੈਂਡੈਂਸੀ-ਕ੍ਰਮਿਤ ਆਉਟਪੁੱਟ ਹੈ। type ਘੋਸ਼ਣਾ ਸ਼ੈਲੀ ਨਾਲ export type User = {...} ਛੱਡਦਾ ਹੈ; readonly ਟੌਗਲ ਚਾਲੂ ਨਾਲ, ਹਰ ਪ੍ਰਾਪਰਟੀ readonly ਮੋਡੀਫਾਇਰ ਪਾਉਂਦੀ ਹੈ।

ਜਨਰੇਟਰ ਵਿਕਲਪ

ਘੋਸ਼ਣਾ ਸ਼ੈਲੀ

interface (ਆਬਜੈਕਟ ਆਕਾਰਾਂ ਲਈ ਮਿਆਰੀ TypeScript ਮੁਹਾਵਰਾ) ਜਾਂ type (ਜੇ ਤੁਹਾਨੂੰ ਬਾਅਦ ਵਿੱਚ ਮੈਪਡ ਕਿਸਮਾਂ, ਕੰਡੀਸ਼ਨਲ ਕਿਸਮਾਂ, ਜਾਂ ਇੰਟਰਸੈਕਸ਼ਨਾਂ ਦੀ ਲੋੜ ਹੋਵੇ) ਚੁਣੋ। ਦੋਵੇਂ ਇੱਕੋ ਰਨਟਾਈਮ ਵਿਵਹਾਰ ਦਿੰਦੇ ਹਨ।

ਓਪਸ਼ਨਲ nullable ਖੇਤਰ

ਜਦੋਂ ਨਮੂਨਾ ਲਿਆ ਮੁੱਲ null ਹੋਵੇ, ਖੇਤਰ ਦੀ ਕਿਸਮ T | null ਬਣਦੀ ਹੈ। ਇਹ ਵਿਕਲਪ ਚਾਲੂ ਕਰਨ ਨਾਲ ? ਮੋਡੀਫਾਇਰ ਵੀ ਜੁੜਦਾ ਹੈ।

Readonly ਮੋਡੀਫਾਇਰ

ਹਰ ਪ੍ਰਾਪਰਟੀ ਘੋਸ਼ਣਾ ਤੇ readonly ਪ੍ਰੀਪੈਂਡ ਕਰਦਾ ਹੈ ਤਾਂ ਜੋ ਛੱਡਿਆ ਇੰਟਰਫੇਸ ਅਟੱਲ ਡੇਟਾ ਮਾਡਲ ਨਾਲ ਮੇਲ ਖਾਂਦਾ ਹੋਵੇ।

ਕੀ ਇਹ ਨੈਸਟਡ ਆਬਜੈਕਟ ਅਤੇ ਐਰੇ ਸਪੋਰਟ ਕਰਦਾ ਹੈ?

ਹਾਂ। ਹਰ ਨੈਸਟਡ ਆਬਜੈਕਟ ਆਪਣੀ ਪੇਰੈਂਟ ਪ੍ਰਾਪਰਟੀ ਕੁੰਜੀ ਤੋਂ ਲਿਆ ਗਿਆ ਇੱਕ ਨਾਮਿਤ ਇੰਟਰਫੇਸ ਬਣ ਜਾਂਦਾ ਹੈ, ਅਤੇ ਐਰੇ ਆਪਣੀ ਸਮੱਗਰੀ ਤੋਂ ਆਈਟਮ ਕਿਸਮ ਅਨੁਮਾਨਿਤ ਕਰਦੇ ਹਨ। ਆਬਜੈਕਟਾਂ ਦੇ ਐਰੇ ਨੂੰ ਹਰ ਆਬਜੈਕਟ ਆਕਾਰ ਲਈ ਇੱਕ ਇੰਟਰਫੇਸ ਮਿਲਦਾ ਹੈ, ਅਤੇ ਜਿੱਥੇ ਆਕਾਰ ਆਪਸ ਵਿੱਚ ਅਸਹਿਮਤ ਹੁੰਦੇ ਹਨ ਉੱਥੇ ਯੂਨੀਅਨ ਕਿਸਮਾਂ ਨਾਲ।

ਓਪਸ਼ਨਲ ਖੇਤਰ ਕਿਵੇਂ ਅਨੁਮਾਨਿਤ ਕੀਤੇ ਜਾਂਦੇ ਹਨ?

"null-able ਖੇਤਰਾਂ ਨੂੰ ਓਪਸ਼ਨਲ ਚਿੰਨ੍ਹਿਤ ਕਰੋ" ਟੌਗਲ ਚਾਲੂ ਕਰੋ ਅਤੇ ਜਿਸ ਵੀ ਖੇਤਰ ਦਾ ਨਮੂਨਾ ਲਿਆ ਗਿਆ ਮੁੱਲ null ਹੈ ਉਸਨੂੰ ਕੁੰਜੀ ਉੱਤੇ ਇੱਕ ? ਮੋਡੀਫਾਇਰ ਅਤੇ ਕਿਸਮ ਵਿੱਚ | null ਮਿਲਦਾ ਹੈ। ਟੌਗਲ ਤੋਂ ਬਿਨਾਂ, ਖੇਤਰ ਲੋੜੀਂਦਾ ਰਹਿੰਦਾ ਹੈ ਅਤੇ ਕਿਸਮ ਸਿਰਫ਼ T | null ਹੁੰਦੀ ਹੈ।

ਕੀ ਇਹ ਡਿਸਕ੍ਰੀਮੀਨੇਟਡ ਯੂਨੀਅਨ ਸਪੋਰਟ ਕਰਦਾ ਹੈ?

ਬੁਨਿਆਦੀ ਯੂਨੀਅਨ ਕਿਸਮਾਂ ਉਦੋਂ ਨਿਕਲਦੀਆਂ ਹਨ ਜਦੋਂ ਇੱਕ ਐਰੇ ਮਿਲੇ-ਜੁਲੇ ਆਕਾਰ ਵਾਲੇ ਆਈਟਮ ਰੱਖਦੀ ਹੈ ਜਾਂ ਜਦੋਂ ਇੱਕ ਖੇਤਰ ਇੱਕ ਮੁੱਲ ਅਤੇ null ਦੋਵੇਂ ਚੁੱਕਦਾ ਹੈ। ਪੂਰਾ ਡਿਸਕ੍ਰੀਮੀਨੇਟਡ-ਯੂਨੀਅਨ ਅਨੁਮਾਨ (ਟੈਗ ਵਜੋਂ type ਜਾਂ kind ਚੁਣਨਾ ਅਤੇ ਵੇਰੀਐਂਟਾਂ ਨੂੰ ਵੰਡਣਾ) ਕਈ ਸੈਂਪਲਾਂ ਦੀ ਲੋੜ ਰੱਖਦਾ ਹੈ — ਉਹ ਯੋਜਨਾਬੱਧ ਹੈ ਪਰ ਅੱਜ ਦੇ ਬਿਲਡ ਵਿੱਚ ਨਹੀਂ ਹੈ।

ਕੀ ਮੈਂ ਕਈ JSON ਸੈਂਪਲਾਂ ਤੋਂ ਕਿਸਮਾਂ ਅਨੁਮਾਨਿਤ ਕਰ ਸਕਦਾ ਹਾਂ?

ਅਜੇ ਨਹੀਂ — ਅੱਜ ਦਾ ਅਨੁਮਾਨਕਰਤਾ ਇੱਕ ਵਾਰ ਵਿੱਚ ਇੱਕ ਸੈਂਪਲ ਪੜ੍ਹਦਾ ਹੈ। ਜੇ ਤੁਹਾਡੇ ਕੋਲ ਦੋ ਪੇਲੋਡ ਹਨ ਜਿਨ੍ਹਾਂ ਨੂੰ ਇੱਕ ਇੰਟਰਫੇਸ ਸਾਂਝਾ ਕਰਨਾ ਚਾਹੀਦਾ ਹੈ (ਮੰਨ ਲਓ, ਇੱਕ ਲਿਸਟ ਐਂਡਪੁਆਇੰਟ ਅਤੇ ਇੱਕ ਸਿੰਗਲ-ਆਈਟਮ ਐਂਡਪੁਆਇੰਟ), ਤਾਂ ਵਿਹਾਰਕ ਹੱਲ ਇਹ ਹੈ ਕਿ ਉਹਨਾਂ ਨੂੰ ਇੱਕ ਐਰੇ ਵਿੱਚ ਮਿਲਾ ਦਿਓ, ਉਸ ਤੋਂ ਬਣਾਓ, ਅਤੇ ਫਿਰ ਨਤੀਜੇ ਵਜੋਂ ਆਈਆਂ ਯੂਨੀਅਨ ਕਿਸਮਾਂ ਦਾ ਨਾਮ ਬਦਲ ਦਿਓ। ਮਲਟੀ-ਸੈਂਪਲ ਅਨੁਮਾਨ ਰੋਡਮੈਪ ਉੱਤੇ ਹੈ ਕਿਉਂਕਿ ਇਹੀ ਇੱਕੋ-ਇੱਕ ਤਰੀਕਾ ਹੈ ਉਹਨਾਂ ਖੇਤਰਾਂ ਨੂੰ ਪਛਾਣਨ ਦਾ ਜੋ ਇੱਕ ਜਵਾਬ ਵਿੱਚ ਮੌਜੂਦ ਹਨ ਅਤੇ ਦੂਜੇ ਵਿੱਚ ਗੈਰਹਾਜ਼ਰ।

ਪੇਲੋਡ ਪੇਸਟ ਕਰੋ, ਰੂਟ ਦਾ ਨਾਮ ਰੱਖੋ, ਇੰਟਰਫੇਸ ਕਾਪੀ ਕਰੋ। ਪੂਰੀ ਪਾਈਪਲਾਈਨ ਤੁਹਾਡੇ ਬ੍ਰਾਊਜ਼ਰ ਵਿੱਚ ਚੱਲਦੀ ਹੈ।