আমি কেবল টাইপস্ক্রিপ্ট দিয়ে একটি প্রতিক্রিয়া প্রকল্পে কাজ শুরু করি এবং নিজেকে জিজ্ঞাসা করি নিয়মিত ক্লাস ফাইলগুলি দিয়ে আমার কী করা উচিত? আমার .tsকি .tsxফাইল বা ফাইলগুলি ব্যবহার করা উচিত এবং তারপরে কোনও .tsxপ্রতিক্রিয়া প্রকল্প না হওয়ার পরেও আমি সমস্ত সময় ফাইল ব্যবহার না করার কোনও কারণ খুঁজে পাইনি !
এমন কোনও কারণ বা নির্দিষ্ট পরিস্থিতি রয়েছে যা আমাদের .tsxফাইল ব্যবহার করা উচিত নয় ? যদি না হয় তবে টাইপস্ক্রিপ্ট টিম কেন পুরো নতুন এক্সটেনশন যুক্ত করবে?
উত্তর:
আপনি খুব সামান্য পার্থক্যের tsxপরিবর্তে ব্যবহার করতে পারেন ts। tsxস্পষ্টতই jsxটাইপস্ক্রিপ্টের ভিতরে ট্যাগগুলির ব্যবহারের অনুমতি দেয় , তবে এটি কিছু পার্সিং অস্পষ্টতার পরিচয় দেয় যা টিএসএক্সকে কিছুটা আলাদা করে তোলে। আমার অভিজ্ঞতায় এই পার্থক্যগুলি খুব বেশি বড় নয়:
<>যে জেএসএক্স ট্যাগের চিহ্নিতকারী হিসাবে এটি কাজ করে না তার সাথে জাল টাইপ করুন।
প্রকারের নিরীক্ষণের জন্য টাইপস্ক্রিপ্টের দুটি বাক্য গঠন রয়েছে। তারা উভয়ই একই জিনিসটি করে তবে একটি টিএসএক্সে ব্যবহারযোগ্য অন্যটি নয়:
let a: any;
let s = a as string // ok in tsx and ts
let s2 = <string>a // only valid in tsআমি ব্যবহার করেন asপরিবর্তে <>মধ্যে tsদৃঢ়তা জন্য ভাল হিসাবে ফাইল। asআসলে টাইপস্ক্রিপ্টে চালু হয়েছিল কারণ <>এটি ব্যবহারযোগ্য ছিল নাtsx
কোনও বাধা ছাড়াই জেনেরিক তীর ফাংশনগুলি সঠিকভাবে পার্স করা যায় না
নীচের তীর ফাংশনটি ঠিক আছে tsতবে একটি ত্রুটি tsxহিসাবে <T>একটি ট্যাগ শুরু হওয়ার অর্থ ব্যাখ্যা করা হয়েছেtsx
const fn = <T>(a: T) => aআপনি বাধা যুক্ত করে বা তীর ফাংশনটি ব্যবহার না করে এটি পেতে পারেন:
const fn = <T extends any>(a: T) => a
const fn = <T,>(a: T) => a // this also works but looks weird IMO
const fn = function<T>(a: T) { return a;}বিঃদ্রঃ
আপনি ts এর পরিবর্তে tsx ব্যবহার করতে পারেন, আমি এর বিপরীতে সুপারিশ করব। কনভেনশন একটি শক্তিশালী জিনিস, লোকেদের সাথে tsxমিলিত হয় jsxএবং সম্ভবত অবাক হয় যে আপনার কোনও jsxট্যাগ নেই, সেরা বিকাশকারীকে সর্বনিম্ন অবাক করে দিন।
উপরের অস্পষ্টতাগুলি (যদিও সম্ভবত সম্পূর্ণ তালিকা নয়) বড় না হলেও তারা tsফাইলগুলিকে পিছনে সামঞ্জস্যপূর্ণ রাখতে নতুন সিনট্যাক্সের জন্য একটি ডেডিকেটেড ফাইল এক্সটেনশন ব্যবহারের সিদ্ধান্তে সম্ভবত বড় ভূমিকা নিয়েছিল ।
(যেখানে কোনও জেএসএক্স ট্যাগ হাজির না হওয়ার আগে আসে তাই কোনও অস্পষ্টতা নেই।
xআপনার জাভাস্ক্রিপ্ট JSX Harmonyমোডে থাকা অবস্থায় শেষ পর্যন্ত এটি ব্যবহারের মতো ধরণ। এটি যখন বৈধ হয়:
doSomething(<div>My div</div>);তবে আপনার ফাইলের প্রসারণটি আসলে কোনও ব্যাপার নয়, যতক্ষণ না আপনার প্রসেসরগুলি আপনার সিদ্ধান্ত সম্পর্কে অবগত থাকে (ব্রাউজ করুন বা ওয়েবপ্যাক)। আমি, একের জন্য, .jsআমার সমস্ত জাভাস্ক্রিপ্টের জন্য ব্যবহার করি, এমনকি যখন তারা প্রতিক্রিয়া দেখায়। টাইপস্ক্রিপ্ট, একই জন্য প্রযোজ্য ts/tsx।
সম্পাদনা
এখন, আমি জাভা স্ক্রিপ্টটির জন্য রিঅ্যাক্ট সিনট্যাক্স সহ জেএসএক্স এবং টাইপস্ক্রিপ্টের জন্য টিএসএক্স প্রতিক্রিয়া সহ দৃ strongly়ভাবে সুপারিশ করব কারণ বেশিরভাগ সম্পাদক / আইডিইগুলি প্রতিক্রিয়া সিনট্যাক্স সক্ষম বা না করতে এক্সটেনশনটি ব্যবহার করবে। এটিকে আরও অভিব্যক্তিক হিসাবে বিবেচনা করা হয়।
tsএবং সম্পর্কে মূল প্রশ্নের সঠিক উত্তর নয় tsx। টাইপসক্রিপ্টে সংকলক কেবল .tsxফাইলগুলিতে জেএসএক্স সিনট্যাক্স সক্ষম করে, কারণ সিনট্যাক্স টিএস সিনট্যাক্সের সাথে কিছুটা অস্পষ্টতা তৈরি করে (যেমন দৃ the় সংশ্লেষ <>), এটি সমাধান করার জন্য সংকলক একটি tsxফাইলের বিপরীতে কোনও ফাইলে বিভিন্ন ধরণের অনুমান করে ts। তিতিয়ান সের্নিকোভা-ড্রাগোমিরের উত্তর দেখুন।
জেএসএক্স এক্সটেনশানটি চালু করার কারণটি হ'ল জেএসএক্স জেএস সিনট্যাক্সের একটি এক্সটেনশন এবং সুতরাং .jsx ফাইলগুলিতে বৈধ জাভাস্ক্রিপ্ট থাকে না।
টাইপসক্রিপ্ট .ts এবং .tsx এক্সটেনশানগুলি প্রবর্তন করে একই কনভেনশন অনুসরণ করে। একটি ব্যবহারিক পার্থক্য হ'ল .tsx প্রকারভেদগুলিকে অনুমতি দেয় না <Type>কারণ বাক্য গঠনটি জেএসএক্স ট্যাগগুলির সাথে বিরোধে রয়েছে। জরিপগুলি as Typeপ্রতিস্থাপন হিসাবে প্রবর্তন করা হয়েছিল <Type>এবং .ts এবং .tsx উভয় ক্ষেত্রেই ধারাবাহিকতার কারণে পছন্দসই পছন্দ হিসাবে বিবেচিত হয়েছিল। .Tsx ফাইলটিতে .ts থেকে কোড ব্যবহার করা হলে <Type>এটি ঠিক করতে হবে।
.Tsx এক্সটেনশনের ব্যবহার বোঝায় যে একটি মডিউল প্রতিক্রিয়া সম্পর্কিত এবং জেএসএক্স সিনট্যাক্স ব্যবহার করে। যদি এটি না হয় তবে এক্সটেনশনটি মডিউল সামগ্রী এবং প্রকল্পের ভূমিকা সম্পর্কে ভ্রান্ত ধারণা তৈরি করতে পারে, এটি ডিফল্টরূপে .tsx এক্সটেনশন ব্যবহার করার বিরুদ্ধে যুক্তি।
অন্যদিকে, কোনও ফাইল যদি প্রতিক্রিয়ার সাথে সম্পর্কিত হয় এবং কোনও পর্যায়ে জেএসএক্স ধারণের ভাল সম্ভাবনা থাকে, তবে পরে নাম পরিবর্তন করা এড়াতে এটি শুরু থেকে .tsx হিসাবে নামকরণ করা যেতে পারে।
উদাহরণস্বরূপ, ইউটিলিটি ফাংশনগুলি যা রিঅ্যাক্ট উপাদানগুলির সাথে একসাথে ব্যবহৃত হয় সেগুলি যে কোনও সময়ে জেএসএক্সকে জড়িত করতে পারে এবং তাই নিরাপদে .tsx নামগুলি ব্যবহার করা যেতে পারে, যখন রেডাক্স কোড স্ট্রাকচারটি সরাসরি প্রতিক্রিয়া উপাদানগুলি ব্যবহার করার কথা নয়, প্রতিক্রিয়া বাদে ব্যবহার করা ও পরীক্ষা করা যেতে পারে এবং .ts নাম ব্যবহার করতে পারেন।
আমি .tsx ফাইলগুলির সাথে বিশ্বাস করি আপনি সমস্ত জেএসএক্স (জাভাস্ক্রিপ্ট এক্সএমএল) কোডটি ব্যবহার করতে পারেন। .Ts ফাইলে আপনি কেবলমাত্র টাইপস্ক্রিপ্ট ব্যবহার করতে পারেন।
.tsফাইলগুলির একটি <AngleBracket>প্রকারের দৃ synt় সংশ্লেষ রয়েছে যা জেএসএক্স ব্যাকরণের সাথে বিরোধপূর্ণ। এক টন লোককে ভাঙতে না .tsxপারার জন্য , আমরা জেএসএক্সের জন্য ব্যবহার করি এবং foo as Barসিনট্যাক্স যুক্ত করেছি যা উভয় .tsএবং .tsxফাইল উভয়ই অনুমোদিত allowed
let someValue: any = "this is a string";
let strLength: number = (<string>someValue).length;এবং অন্যটি হ'ল সিনট্যাক্স:
let someValue: any = "this is a string";
let strLength: number = (someValue as string).length;আমরা .ts ব্যবহার করতে পারি as-syntaxতবে <string>someValueদুর্দান্ত!