TypeScript ابر مجموعه ای از جاوا اسکریپت است که تایپ استاتیک را به جاوا اسکریپت معرفی می کند. ایمنی نوع پیشرفته و قابلیت نگهداری کد TypeScript به توسعه دهندگان این امکان را می دهد که کد را با اطمینان بیشتری بنویسند.

یکی از جنبه های اساسی سیستم تایپ استاتیک TypeScript پشتیبانی آن از انواع پایه است. اینها پایه ای برای تعریف شکل و رفتار داده ها در برنامه های TypeScript فراهم می کنند.

در این راهنمای جامع، انواع اصلی TypeScript را با مقایسه آنها با همتایان جاوا اسکریپت آنها تحلیل خواهیم کرد. من همچنین تفاوت ها و مزایای ارائه شده توسط ویژگی های تایپ استاتیک TypeScript را توضیح خواهم داد.

می توانید تمام کدهای جاوا اسکریپت و تایپ اسکریپت را از اینجا دریافت کنید.

فهرست مطالب

درک حاشیه نویسی نوع

جاوا اسکریپت در مقابل انواع پایه تایپ اسکریپت

نتیجه

درک حاشیه نویسی نوع

حاشیه نویسی نوع در TypeScript شامل مشخص کردن صریح نوع داده متغیرها، پارامترهای تابع و مقادیر بازگشتی است. این حاشیه‌نویسی وضوح کد را افزایش می‌دهد و تحلیل نوع استاتیک TypeScript را قادر می‌سازد تا خطاها را در طول کامپایل پیدا کند. این کیفیت کد و قابلیت نگهداری را بهبود می بخشد.

در TypeScript، حاشیه نویسی نوع با استفاده از دو نقطه ( : ) و سپس نوع مورد نظر نوشته می شود. بیایید نحوه اعمال حاشیه نویسی نوع در انواع اصلی TypeScript را تحلیل کنیم:

جاوا اسکریپت در مقابل انواع پایه تایپ اسکریپت

بولی

در اینجا نحوه نوشتن یک بولین در جاوا اسکریپت آمده است:

 let isDone = false; console.log("isDone:", isDone); // Output: isDone: false if (!isDone) { console.log("Task is not done yet."); }

در جاوا اسکریپت، یک متغیر بولی isDone اعلام شده و با مقدار false مقداردهی اولیه می شود. شرط !isDone تحلیل می کند که آیا isDone false است، و اگر درست باشد، پیامی را ثبت می کند که نشان می دهد کار هنوز انجام نشده است.

و در اینجا نحوه اعلان یک بولی در TypeScript آمده است:

 let isDone: boolean = false; console.log("isDone:", isDone); // Output: isDone: false if (!isDone) { console.log("Task is not done yet."); }

در TypeScript، همان متغیر بولی isDone با حاشیه نویسی نوع صریح : boolean اعلام می شود که نشان می دهد فقط می تواند مقادیر بولی را نگه دارد. رفتار و خروجی مانند جاوا اسکریپت باقی می ماند.

عدد

در اینجا نحوه اعلام یک عدد در جاوا اسکریپت آمده است:

 let count = 42; let totalPrice = 24.99; let quantity = 10; console.log("count:", count); // Output: count: 42 console.log("totalPrice:", totalPrice); // Output: totalPrice: 24.99 console.log("quantity:", quantity); // Output: quantity: 10

در جاوا اسکریپت، متغیرهای عددی count ، totalPrice و quantity با مقادیر عددی اعلام و مقداردهی اولیه می شوند. هر مقدار نشان دهنده یک نوع عددی متفاوت است (به ترتیب عدد صحیح، ممیز شناور، عدد صحیح).

و در TypeScript:

 let count: number = 42; let totalPrice: number = 24.99; let quantity: number = 10; console.log("count:", count); // Output: count: 42 console.log("totalPrice:", totalPrice); // Output: totalPrice: 24.99 console.log("quantity:", quantity); // Output: quantity: 10

در TypeScript، نوع annotations : number به هر اعلان متغیر اضافه می شود و به صراحت مشخص می کند که آنها فقط می توانند مقادیر عددی را نگه دارند. این وضوح و ایمنی نوع مشابه جاوا اسکریپت را فراهم می کند.

رشته

در اینجا نحوه نوشتن یک رشته در جاوا اسکریپت آمده است:

 let message = "Hello, JavaScript!"; let firstName = "John"; let lastName = "Doe"; console.log("message:", message); // Output: message: Hello, JavaScript! console.log("firstName:", firstName); // Output: firstName: John console.log("lastName:", lastName); // Output: lastName: Doe

در جاوا اسکریپت، متغیرهای رشته message ، firstName و lastName اعلان شده و با مقادیر رشته مقداردهی اولیه می شوند.

و در اینجا نحوه انجام آن در TypeScript آمده است:

 let message: string = "Hello, TypeScript!"; let firstName: string = "John"; let lastName: string = "Doe"; console.log("message:", message); // Output: message: Hello, TypeScript! console.log("firstName:", firstName); // Output: firstName: John console.log("lastName:", lastName); // Output: lastName: Doe

در TypeScript، نوع حاشیه نویسی : string به هر اعلان متغیر اضافه می شود و به صراحت مشخص می کند که آنها فقط می توانند مقادیر رشته را نگه دارند. این خوانایی و قابلیت نگهداری کد را افزایش می دهد.

آرایه

در اینجا چگونه می توانید یک آرایه را در جاوا اسکریپت اعلام کنید:

 let numbers = [1, 2, 3, 4, 5]; let fruits = ["apple", "banana", "orange"]; console.log("numbers:", numbers); // Output: numbers: [1, 2, 3, 4, 5] console.log("fruits:", fruits); // Output: fruits: ["apple", "banana", "orange"]

در جاوا اسکریپت، numbers آرایه ها و fruits به ترتیب با مقادیر عددی و رشته ای اعلان و مقداردهی اولیه می شوند.

در اینجا نحوه انجام آن در TypeScript آمده است:

 let numbers: number[] = [1, 2, 3, 4, 5]; let fruits: string[] = ["apple", "banana", "orange"]; console.log("numbers:", numbers); // Output: numbers: [1, 2, 3, 4, 5] console.log("fruits:", fruits); // Output: fruits: ["apple", "banana", "orange"]

در TypeScript، حاشیه‌نویسی‌های نوع اضافه می‌شوند تا آرایه‌هایی را با انواع عناصر خاص ( : number[] و : string[] اعلان کنند، و اطمینان حاصل شود که فقط مقادیر عددی یا رشته‌ای را می‌توان به ترتیب در آرایه‌های numbers و fruits ذخیره کرد.

چندتایی

در اینجا نحوه نوشتن یک تاپل در TypeScript آمده است:

 let person: [string, number] = ["John", 30]; console.log("person:", person); // Output: person: ["John", 30]

در TypeScript، یک person تاپلی با حاشیه‌نویسی صریح نوع [string, number] اعلان می‌شود که نشان می‌دهد باید یک رشته به دنبال آن یک عدد باشد. نام و سن افراد را ذخیره می کند.

و در اینجا شبیه سازی جاوا اسکریپت است:

 // JavaScript does not have built-in support for tuples, but we can use arrays. let person = ["John", 30]; console.log("person:", person); // Output: person: ["John", 30]

در جاوا اسکریپت، از آنجایی که تاپل ها پشتیبانی نمی شوند، آرایه ها اغلب به عنوان راه حلی برای شبیه سازی رفتار تاپل مانند استفاده می شوند. person آرایه، نام و سن یک فرد را، مشابه نمونه TypeScript، ذخیره می کند.

Enum

در اینجا نحوه اعلان enum در TypeScript آمده است:

 enum Direction { Up, Down, Left, Right } let direction: Direction = Direction.Up; console.log("direction:", direction); // Output: direction: 0

در TypeScript، یک Direction enum با ثابت‌های نام‌گذاری شده Up ، Down ، Left و Right اعلام می‌شود که به‌طور پیش‌فرض مقادیر عددی را از 0 شروع می‌کنند. به متغیر direction مقدار Direction.Up اختصاص داده شده است.

و در اینجا شبیه سازی جاوا اسکریپت است:

 // JavaScript does not have built-in support for enums, but we can use objects or constants. const Direction = { Up: 0, Down: 1, Left: 2, Right: 3 }; let direction = Direction.Up; console.log("direction:", direction); // Output: direction: 0

در جاوا اسکریپت، enum ها به صورت بومی پشتیبانی نمی شوند، پس اشیا یا ثابت ها اغلب برای شبیه سازی رفتار enum مانند استفاده می شوند. در اینجا، شی Direction شامل ثابت‌های نام‌گذاری‌شده با مقادیر عددی است، و به متغیر direction ، مقدار Direction.Up ، مشابه نمونه TypeScript، اختصاص می‌یابد.

نتیجه

انواع پایه تایپ اسکریپت مزایای قابل توجهی نسبت به جاوا اسکریپت سنتی از نظر ایمنی نوع، وضوح و قابلیت نگهداری دارند.

TypeScript با معرفی حاشیه نویسی های نوع صریح و ساختارهای نوع اضافی مانند تاپل ها و enums، به توسعه دهندگان این امکان را می دهد که کد قوی تر و بدون خطا بنویسند.

درک تفاوت‌های بین انواع پایه جاوا اسکریپت و تایپ اسکریپت برای استفاده از پتانسیل کامل قابلیت‌های تایپ استاتیک TypeScript در توسعه وب مدرن ضروری است.

اگر بازخوردی دارید، می‌توانید در توییتر یا لینکدین به من پیام دهید.

خبرکاو