মূল বিষয়বস্তুতে যান
CuteJSON
↑↓ নেভিগেট Enter নির্বাচন Esc বন্ধ

JSON কিভাবে TypeScript ইন্টারফেসে রূপান্তর করবেন

প্রকাশিত 2 মিনিট পড়ুন Akash Kinkar Pandey দ্বারা

একটি JSON রেসপন্সের জন্য TypeScript টাইপ হাতে লেখা পুনরাবৃত্তিমূলক এবং প্রথম চেষ্টায় সূক্ষ্মভাবে ভুল হওয়া সহজ, বিশেষত যখন একটি ফিল্ড ঐচ্ছিক বা মান তিন স্তর গভীরে নেস্টেড।

JSON to TypeScript জেনারেটর ব্যবহার করা

একটি নথি পেস্ট করুন, বা একটি অ্যারেতে একাধিক রেকর্ড, রুট টাইপের নাম দিন, ইন্টারফেস বা type aliases বেছে নিন, এবং Generate types চাপুন। টাইপ ইনফারেন্স এই সাইটের স্কিমা জেনারেটর-এর সাথে শেয়ার করা হয়, তাই দুটি পেজ একমত যে আপনার নথি প্রকৃতে কী ধারণ করে এবং শুধু উত্তর কীভাবে লেখা হয় তাতে ভিন্ন।

দেওয়া

[
  {"user": {"name": "a"}, "tags": [], "meta": {}},
  {"user": {"name": "b"}, "tags": ["x"], "meta": {}, "extra": true}
]

আউটপুট হলো:

export interface RootItem {
  user: User
  tags: string[]
  meta: Record<string, unknown>
  extra?: boolean
}

export interface User {
  name: string
}

export type Root = RootItem[]

নেস্টেড অবজেক্ট তাদের নিজস্ব নামকৃত টাইপ কেন পায়

তিন স্তর গভীর একটি ইনলাইন টাইপ অপঠনীয়, এবং ফাইলে অন্য কিছু এর প্রতি ইঙ্গিত করতে পারে না। নামগুলি অবজেক্ট ধারণকারী কী থেকে আসে, একটি অ্যারের ভিতরে একবচনীকৃত (Root থেকে RootItem), এবং একটি পুনরাবৃত্ত নাম একটি সংখ্যা যুক্ত হয় যাতে আউটপুট সবসময় সংঘর্ষ ছাড়াই কম্পাইল হয়।

ঐচ্ছিক মার্ক প্রকৃতে কী প্রতিশ্রুতি দেয়

extra?: boolean মানে কী আপনার নমুনায় কমপক্ষে একটি রেকর্ডে কী অনুপস্থিত ছিল, ঠিক একই নিয়ম যেটি স্কিমা জেনারেটর required-এর জন্য ব্যবহার করে। এর মানে এই নয় যে ফিল্ড আপনার সমগ্র API-তে ঐচ্ছিক নিশ্চিত, শুধু আপনার নমুনা প্রমাণ করতে পারে না যে এটি সবসময় বিদ্যমান। মার্কটিকে আপনার ডেটা থেকে প্রমাণ হিসাবে পড়ুন, উৎস সিস্টেম থেকে প্রতিশ্রুতি হিসাবে নয়।

ফাঁকা মান

একটি ফাঁকা অবজেক্ট ফাঁকা ইন্টারফেসের পরিবর্তে Record<string, unknown> হয়ে যায়, কারণ ফাঁকা ইন্টারফেস যেকোনো কিছু গ্রহণ করে এবং আকৃতি সম্পর্কে কোনো কার্যকর কথা বলে না। একটি ফাঁকা অ্যারে unknown[] হয়ে যায়, কারণ এর ভিতরে উপাদান টাইপ অনুমান করার জন্য কিছুই নেই, এবং একটি তৈরি করা হবে একটি তথ্য হিসাবে প্রস্তুত অনুমান।

কেন প্রতিটি সংখ্যা শুধু number

TypeScript-এর আলাদা ইন্টেজার টাইপ নেই, তাই একটি ফিল্ড যা আপনার নমুনায় সবসময় একটি পূর্ণসংখ্যা তাও এখনো number টাইপেড, যেমন একটি যাতে দশমলব আছে। এটি প্রতিফলিত করে TypeScript নিজে সংখ্যা কীভাবে মডেল করে, তাই জেনারেটেড টাইপ কম্পাইল এবং আচরণ করে সম্পূর্ণ হাতে লেখা টাইপের মতো।

সব পোস্টে ফিরুন