جدیدترین ویژگی‌های تایپ اسکریپت: نگاهی عمیق به TypeScript 5.x

تایپ اسکریپت (TypeScript) به سرعت خود را به عنوان یکی از ضروری‌ترین ابزارهای توسعه وب مدرن تثبیت کرده است. با ارائه قابلیت‌های بررسی نوع ایستا (Static Type Checking) به جاوااسکریپت، به توسعه‌دهندگان کمک می‌کند تا کدهای پایدارتر، قابل نگهداری‌تر و قابل مقیاس‌پذیری بنویسند. هر نسخه جدید تایپ اسکریپت، نه تنها ویژگی‌های جدیدی را معرفی می‌کند بلکه بهبودهای قابل توجهی در عملکرد و تجربه توسعه‌دهنده (DX) به ارمغان می‌آورد.

سری 5.x تایپ اسکریپت که با انتشار TypeScript 5.0 در مارس 2023 آغاز شد و تا آخرین نسخه‌های 5.4 و فراتر از آن ادامه یافته است، مجموعه‌ای از تغییرات بنیادین، بهینه‌سازی‌های عملکردی و ویژگی‌های جدید را به ارمغان آورده که مسیر توسعه جاوااسکریپت را به شکل قابل توجهی متحول کرده است. هدف این مقاله، بررسی عمیق و جامع این ویژگی‌ها و تشریح تأثیر آن‌ها بر معماری پروژه‌ها و فرآیند توسعه است. ما به جزئیات فنی هر ویژگی می‌پردازیم، مثال‌های عملی ارائه می‌دهیم و پیامدهای استفاده از آن‌ها را برای جامعه توسعه‌دهندگان تحلیل می‌کنیم.

از بازسازی جامع دکوراتورها بر اساس استاندارد جدید ECMAScript گرفته تا معرفی اعلان‌های using برای مدیریت منابع صریح و بهبودهای بی‌نظیر در عملکرد کامپایلر، TypeScript 5.x فراتر از یک به‌روزرسانی ساده است؛ این مجموعه نسخه‌ها نشان‌دهنده یک جهش تکاملی در نحوه نوشتن و نگهداری کد در اکوسیستم جاوااسکریپت است. توسعه‌دهندگان اکنون می‌توانند با اطمینان بیشتری کد بنویسند، باگ‌ها را در مراحل اولیه توسعه کشف کنند و از ابزارهای قدرتمندتری برای ساخت برنامه‌های پیچیده بهره‌مند شوند. بیایید به عمق این تغییرات شیرجه بزنیم.

TypeScript 5.0: شروع انقلابی جدید در تایپ‌بندی

TypeScript 5.0 یک نقطه عطف مهم در تاریخ تایپ اسکریپت است. این نسخه نه تنها ویژگی‌های جدید هیجان‌انگیزی را معرفی کرد، بلکه بهبودهای عملکردی چشمگیری را نیز به ارمغان آورد که تجربه توسعه‌دهنده را به طور قابل توجهی ارتقا داد. در اینجا به برخی از مهمترین ویژگی‌های این نسخه می‌پردازیم:

دکوراتورهای استاندارد ECMAScript (Standard ECMAScript Decorators)

یکی از بزرگترین و مورد انتظارترین تغییرات در TypeScript 5.0، پیاده‌سازی دکوراتورهای استاندارد ECMAScript بود. دکوراتورها راهی برای افزودن ابرداده (metadata) یا تغییر رفتار کلاس‌ها، متدها، ویژگی‌ها (properties) و پارامترها در زمان تعریف هستند. در نسخه‌های قبلی TypeScript، دکوراتورها در یک مرحله اولیه از استاندارد (stage 2) قرار داشتند و پیاده‌سازی آن‌ها به گونه‌ای بود که انتظار می‌رفت در آینده تغییر کند. با TypeScript 5.0، دکوراتورها به مرحله 3 (stage 3) استاندارد ECMAScript رسیدند و TypeScript پیاده‌سازی خود را با این استاندارد جدید تطبیق داد.

این تغییر بدان معناست که نحو و رفتار دکوراتورها به طور قابل توجهی متفاوت از نسخه قدیمی است. دکوراتورهای قدیمی به سادگی توابعی بودند که در زمان تعریف شی هدف فراخوانی می‌شدند. دکوراتورهای جدید، یک مقدار اولیه (initializer) را برمی‌گردانند که در زمان ساخت شی مورد استفاده قرار می‌گیرد. این رویکرد جدید، انعطاف‌پذیری و قدرت بیشتری را برای دکوراتورها فراهم می‌کند و آن‌ها را با جاوااسکریپت بومی هماهنگ‌تر می‌سازد. مهاجرت از دکوراتورهای قدیمی به جدید نیازمند تغییرات در کد است، اما این تغییرات به سمت یک استاندارد پایدار و آینده‌نگر است.

مثال دکوراتور کلاس (قدیمی در مقابل جدید):

// دکوراتور قدیمی (Pre-TS 5.0)
function LoggerOld(constructor: Function) {
    console.log('Logging (Old):', constructor.name);
}

@LoggerOld
class MyClassOld {
    constructor() {
        console.log('MyClassOld instantiated');
    }
}

// دکوراتور جدید (TS 5.0+)
function LoggerNew<T extends { new (...args: any[]): {} }>(constructor: T) {
    return class extends constructor {
        constructor(...args: any[]) {
            super(...args);
            console.log('Logging (New):', constructor.name);
        }
    }
}

@LoggerNew
class MyClassNew {
    constructor() {
        console.log('MyClassNew instantiated');
    }
}

new MyClassOld(); // خروجی: Logging (Old): MyClassOld، سپس MyClassOld instantiated
new MyClassNew(); // خروجی: MyClassNew instantiated، سپس Logging (New): MyClassNew

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

پارامترهای نوع const (const Type Parameters)

این ویژگی به توسعه‌دهندگان اجازه می‌دهد تا مشخص کنند که یک پارامتر نوع نباید به صورت گسترده (widened) در زمان استنتاج نوع (type inference) عمل کند، بلکه باید به صورت دقیق‌تر و محدودتر (const assertion-like) استنتاج شود. این امر به خصوص در کار با آرایه‌ها و آبجکت‌های لیترال (literal objects) که می‌خواهید نوع آن‌ها تا جای ممکن محدود بماند، بسیار مفید است.

به عنوان مثال، فرض کنید تابعی دارید که یک آرایه از رشته‌ها را دریافت می‌کند و می‌خواهید تایپ هر رشته در آن آرایه به صورت لیترال و ثابت حفظ شود، نه اینکه به سادگی به string[] تبدیل شود. بدون const، تایپ اسکریپت آرایه ['a', 'b'] را به string[] گسترش می‌دهد، در حالی که با const، نوع آن به ['a', 'b'] به صورت ثابت می‌ماند.

مثال const Type Parameters:

function getFirstElement<const T extends readonly any[]>(arr: T): T[0] {
    return arr[0];
}

const colors = ['red', 'green', 'blue'] as const;
const firstColor = getFirstElement(colors); // نوع firstColor: 'red'

const mixedArray = ['hello', 123, true];
const firstMixed = getFirstElement(mixedArray); // نوع firstMixed: string | number | boolean (بدون 'const' گسترش می یابد)

// اگر 'const' را روی پارامتر نوع اعمال کنیم:
function getSpecificFirstElement<const T extends readonly any[]>(arr: T): T[0] {
    return arr[0];
}

const specificMixed = getSpecificFirstElement(['hello', 123, true]);
// نوع specificMixed: 'hello' (زیرا 'const' از گسترش نوع جلوگیری می کند)

پشتیبانی از moduleResolution bundler

TypeScript 5.0 یک گزینه جدید برای moduleResolution به نام bundler معرفی کرد. این گزینه به گونه‌ای طراحی شده که بهتر با نحوه حل ماژول‌ها توسط ابزارهای باندل‌کننده (مثل Webpack، Rollup، Parcel و Esbuild) مطابقت داشته باشد. ابزارهای باندل‌کننده معمولاً از یک رویکرد ترکیبی برای حل ماژول‌ها استفاده می‌کنند که نه کاملاً Node.js و نه کاملاً کلاسیک است.

bundler به TypeScript اجازه می‌دهد تا فایل‌های package.json را به روشی هوشمندانه‌تر بررسی کند و از فیلدهایی مانند "exports" و "imports" به درستی پشتیبانی کند. این موضوع به ویژه برای پروژه‌هایی که از ماژول‌های ESM (ECMAScript Modules) استفاده می‌کنند، بسیار مهم است و به اطمینان از سازگاری بین TypeScript و خروجی باندل‌کننده‌ها کمک می‌کند. استفاده از moduleResolution bundler می‌تواند به رفع خطاهای مربوط به حل ماژول و بهبود تجربه توسعه در پروژه‌های مدرن کمک کند.

تنظیم در tsconfig.json:

{
  "compilerOptions": {
    "moduleResolution": "bundler"
  }
}

بهبودهای عملکردی و کاهش حجم بسته

TypeScript 5.0 تنها به ویژگی‌های جدید اکتفا نکرد، بلکه بهبودهای عملکردی چشمگیری را نیز به همراه داشت. تیم TypeScript بر روی افزایش سرعت کامپایلر و کاهش حجم بسته نصبی کار کرد. این شامل تغییراتی در ساختار داده‌های داخلی، استفاده از Map ها و Set ها به جای Object ها در برخی موارد و بهینه‌سازی‌هایی در نحوه پردازش فایل‌ها بود. نتیجه این تلاش‌ها، کامپایل سریع‌تر و کاهش مصرف حافظه بود که تجربه توسعه‌دهنده را، به خصوص در پروژه‌های بزرگ، به شکل قابل توجهی بهبود بخشید.

این بهبودها به حدی بود که در برخی بنچمارک‌ها، زمان کامپایل تا 10-20% کاهش یافت. کاهش حجم بسته نصبی TypeScript (مثلاً در node_modules) نیز به نوبه خود منجر به نصب سریع‌تر و اشغال فضای کمتر در سیستم‌ها می‌شود.

ویژگی‌های دیگر در TypeScript 5.0

• export type * from "...": این سینتکس جدید به شما اجازه می‌دهد تا تمام تایپ‌ها را از یک ماژول دیگر صادر (export) کنید بدون اینکه مقادیر (values) آن ماژول را صادر کنید. این برای کتابخانه‌هایی که می‌خواهند API تایپ خود را به صورت جداگانه ارائه دهند، بسیار مفید است و از وابستگی‌های زمانی اجرا (runtime dependencies) جلوگیری می‌کند.
• تغییرات در انوم‌ها (Enums): TypeScript 5.0 به انوم‌ها اجازه داد تا در زمان کامپایل به عنوان تایپ‌های لیترال یونین (literal union types) ظاهر شوند. این امر به بهبود بررسی نوع و بهینه‌سازی‌های احتمالی در زمان اجرا کمک می‌کند.
• پرچم --forceConsistentCasingInFileNames بهبود یافته: این پرچم اکنون دارای گزینه‌های all و ignore است که انعطاف‌پذیری بیشتری در کنترل حساسیت به حروف کوچک و بزرگ در نام فایل‌ها فراهم می‌کند.

به طور کلی، TypeScript 5.0 یک به‌روزرسانی مهم بود که پایه‌های بسیاری از ویژگی‌های آینده را بنا نهاد و با بهبودهای عملکردی خود، تجربه توسعه‌دهنده را به شکل قابل توجهی ارتقا داد.

TypeScript 5.1 و 5.2: پختگی و ویژگی‌های بنیادین

پس از جهش بزرگ TypeScript 5.0، نسخه‌های 5.1 و 5.2 بر روی پختگی بیشتر، رفع ابهامات و معرفی ویژگی‌های قدرتمند اما متمرکزتر تمرکز کردند. این نسخه‌ها به بهبود دقت سیستم نوع‌بندی، کارایی کامپایلر و اضافه کردن قابلیت‌های جدید برای مدیریت منابع و سینتکس ECMAScript کمک کردند.

TypeScript 5.1: ظرافت در تایپ‌ها و دکوراتورها

TypeScript 5.1 شامل چندین بهبود ظریف اما مهم در سیستم نوع‌بندی و پشتیبانی از دکوراتورها بود:

• ساده‌سازی استنتاج نوع برای توابع void با بازگشت ضمنی (Simplifying Implicit Returns for void Functions): در نسخه‌های قبلی، اگر یک تابع به صراحت به عنوان void مشخص شده بود، اما به طور ضمنی مقداری را برمی‌گرداند (مثلاً یک تابع forEach که در آخرین خط خود یک console.log دارد)، TypeScript ممکن بود خطای نوع بدهد. TypeScript 5.1 این رفتار را انعطاف‌پذیرتر کرد، به طوری که بازگشت ضمنی undefined یا مقادیر دیگری که می‌توانند نادیده گرفته شوند، در توابع void مجاز شد. این موضوع به خصوص در توابع Callback که اغلب مقداری را برمی‌گردانند اما مقدار برگشتی آن‌ها مهم نیست (مثل Array.prototype.forEach)، مفید است.

// در TS < 5.1 ممکن بود خطای نوع بدهد
function logAndReturnLength(s: string): number {
    console.log(s);
    return s.length;
}

const arr = ['a', 'b', 'c'];
arr.forEach((item) => {
    // در TS < 5.1 ممکن بود 'logAndReturnLength'
    // باعث خطا شود اگر forEach انتظار 'void' داشته باشد
    // اما در TS 5.1 این مورد منعطف تر شد
    logAndReturnLength(item); 
});

// مثال دیگر:
function doSomething(): void {
    // TypeScript 5.1 این را به عنوان یک بازگشت ضمنی 'undefined' مجاز می‌داند
    if (Math.random() > 0.5) {
        return; 
    }
}

• دکوراتورها برای ویژگی‌های accessor (Decorators for accessor Properties): با معرفی دکوراتورهای استاندارد ECMAScript در TS 5.0، TS 5.1 پشتیبانی از دکوراتورها را به ویژگی‌های accessor (get و set) گسترش داد. این امکان به شما اجازه می‌دهد تا رفتار getter و setter ها را با استفاده از دکوراتورها تغییر دهید، که برای الگوهایی مانند اعتبارسنجی یا لاگ‌گیری بسیار مفید است.

class User {
    _name: string = '';

    @logAccess
    get name(): string {
        return this._name;
    }

    set name(value: string) {
        this._name = value;
    }
}

function logAccess(
    target: any,
    context: ClassAccessorDecoratorContext
) {
    return {
        get() {
            console.log(`Getting ${String(context.name)}`);
            return target.get.call(this);
        },
        set(value) {
            console.log(`Setting ${String(context.name)} to ${value}`);
            target.set.call(this, value);
        }
    }
}

const user = new User();
user.name = 'Alice'; // خروجی: Setting name to Alice
console.log(user.name); // خروجی: Getting name، سپس Alice

• بهبود استنتاج نوع پارامترهای setter (Improved Inference for Setter Parameters): TypeScript 5.1 استنتاج نوع پارامترهای setter را دقیق‌تر کرد، به خصوص زمانی که یک setter بدون یک getter متناظر تعریف شده باشد.

TypeScript 5.2: مدیریت منابع صریح و امکانات جدید ES2023

TypeScript 5.2 یک گام مهم دیگر در همگام‌سازی با استاندارد ECMAScript بود و ویژگی‌های هیجان‌انگیزی را معرفی کرد:

• اعلان‌های using و مدیریت منابع صریح (Explicit Resource Management with using Declarations): این یکی از مهمترین ویژگی‌های TypeScript 5.2 است. اعلان‌های using (و await using برای منابع نامتقارن) راهی تمیز و قوی برای مدیریت منابعی ارائه می‌دهند که نیاز به آزادسازی (disposal) دارند، مانند فایل‌ها، اتصالات شبکه یا قفل‌ها. این ویژگی از یک الگوی استاندارد شده به نام پروتکل Disposable و AsyncDisposable استفاده می‌کند.

  با این ویژگی، شما می‌توانید آبجکت‌هایی را تعریف کنید که متد [Symbol.dispose]() (یا [Symbol.asyncDispose]()) دارند. وقتی یک متغیر using از اسکوپ خارج می‌شود، TypeScript به طور خودکار متد dispose آن را فراخوانی می‌کند، مشابه با بلوک‌های try-with-resources در جاوا یا using در C#. این امر به جلوگیری از نشت منابع و ساده‌سازی کد مدیریت خطا کمک می‌کند.

  
  interface Disposable {
      [Symbol.dispose](): void;
  }
  
  class FileHandler implements Disposable {
      private fileDescriptor: number;
  
      constructor(path: string) {
          console.log(`Opening file: ${path}`);
          this.fileDescriptor = Math.floor(Math.random() * 1000); // شبیه‌سازی باز کردن فایل
      }
  
      read(): string {
          console.log(`Reading from file ${this.fileDescriptor}`);
          return `Data from file ${this.fileDescriptor}`;
      }
  
      [Symbol.dispose]() {
          console.log(`Closing file: ${this.fileDescriptor}`);
          // اینجا منطق واقعی بستن فایل قرار می گیرد
      }
  }
  
  function processFile(filename: string) {
      using file = new FileHandler(filename); // 'using' declaration
      const content = file.read();
      console.log(`Processed content: ${content}`);
      // وقتی تابع به پایان برسد، 'Symbol.dispose' به طور خودکار فراخوانی می شود
  }
  
  processFile("my_document.txt");
  // خروجی:
  // Opening file: my_document.txt
  // Reading from file ...
  // Processed content: Data from file ...
  // Closing file: ...
          

• نوع Symbol به عنوان unique symbol (Symbol as a unique symbol Type): TypeScript 5.2 نوع unique symbol را به طور پیش‌فرض برای Symbol ها استنتاج می‌کند، که دقت نوع‌بندی را بهبود می‌بخشد. این بدان معناست که هر Symbol که با Symbol() یا Symbol.for() ایجاد می‌شود، یک نوع منحصر به فرد (unique type) خواهد داشت، که از اشتباه گرفتن Symbol های مختلف جلوگیری می‌کند.
• پشتیبانی از Object.groupBy و Map.groupBy (ES2023): TypeScript 5.2 پشتیبانی نوعی از متدهای جدید Object.groupBy و Map.groupBy را که در ES2023 معرفی شدند، اضافه کرد. این متدها راهی راحت برای گروه‌بندی عناصر یک آرایه بر اساس یک کلید مشخص ارائه می‌دهند.
• بهبودهای بیشتر در --declaration و --emitDecoratorMetadata: برای پروژه‌هایی که از Angular یا فریم‌ورک‌های مشابهی استفاده می‌کنند که به emitDecoratorMetadata نیاز دارند، TypeScript 5.2 بهبودهایی را در نحوه تولید فایل‌های .d.ts هنگام استفاده از این پرچم‌ها ایجاد کرد.

به طور خلاصه، TypeScript 5.1 و 5.2 هر دو به سمت دقیق‌تر و قدرتمندتر کردن سیستم نوع‌بندی TypeScript حرکت کردند. 5.1 با اصلاحات ظریف به تجربه توسعه‌دهنده کمک کرد، در حالی که 5.2 با معرفی using declarations و همگام‌سازی با ES2023، قابلیت‌های مدیریت منابع و کار با داده‌ها را به شکل چشمگیری بهبود بخشید.

TypeScript 5.3 و 5.4: بهینه‌سازی و بهبودهای دقیق

پس از معرفی ویژگی‌های بزرگ در نسخه‌های قبلی 5.x، TypeScript 5.3 و 5.4 تمرکز خود را بر روی بهینه‌سازی‌های دقیق، بهبودهای عملکردی و ظرافت‌های بیشتر در سیستم نوع‌بندی قرار دادند. این نسخه‌ها عمدتاً برای افزایش پایداری، دقت و کارایی در سناریوهای پیچیده‌تر طراحی شده‌اند و تجربه توسعه‌دهنده را روان‌تر می‌کنند.

TypeScript 5.3: دقت بالاتر در ماژول‌ها و سینتکس جدید

TypeScript 5.3 چندین بهبود کلیدی را در نحوه برخورد با ماژول‌ها و سینتکس ECMAScript معرفی کرد:

• حل import type در --moduleResolution bundler: این نسخه یک بهبود مهم در نحوه حل ماژول‌ها برای دستور import type در حالت --moduleResolution bundler (که در TS 5.0 معرفی شد) به ارمغان آورد. پیش از این، import type ممکن بود در برخی شرایط به درستی حل نشود یا باعث ایجاد مشکلاتی در باندل‌کننده‌ها شود. TS 5.3 این رفتار را با رویکرد باندل‌کننده‌ها همگام‌تر کرد و اطمینان حاصل کرد که وارد کردن تایپ‌ها به درستی انجام می‌شود بدون اینکه خروجی جاوااسکریپت نهایی را تحت تأثیر قرار دهد.
• پرچم --verbatimModuleSyntax: این پرچم جدید برای اطمینان از اینکه ساختار ماژول‌ها (import و export) در خروجی جاوااسکریپت دقیقاً همان چیزی است که در کد تایپ اسکریپت نوشته شده است، معرفی شد. به طور پیش‌فرض، TypeScript ممکن است import ها و export ها را به روش‌های مختلفی تبدیل کند تا با سیستم‌های ماژول مختلف (CommonJS، ESM) سازگار باشد. --verbatimModuleSyntax این تبدیل‌ها را محدود می‌کند و به توسعه‌دهندگان کنترل بیشتری بر خروجی نهایی می‌دهد، که به خصوص در پروژه‌هایی که از باندل‌کننده‌های پیشرفته یا محیط‌های سخت‌گیرانه ESM استفاده می‌کنند، مفید است.

// example.ts
import { TypeA } from './moduleA'; // import معمولی (مقدار و نوع)
import type { TypeB } from './moduleB'; // import فقط برای نوع

export type MyType = TypeA | TypeB;
export const myValue = 10;

// با --verbatimModuleSyntax، TypeScript این import ها را حفظ می کند
// مگر اینکه واقعا مورد استفاده قرار نگیرند.
// این کمک می کند تا باندل کننده ها بهتر بفهمند چه چیزی حذف شود.
    

• ویژگی resolution-mode در import Attributes: TypeScript 5.3 پشتیبانی از ویژگی resolution-mode در import attributes را اضافه کرد. این یک ویژگی آینده‌نگر ECMAScript است که به شما اجازه می‌دهد تا به صراحت مشخص کنید که چگونه یک import باید حل شود (مثلاً "type" یا "module"). این امر به وضوح بیشتری در Intent های توسعه‌دهنده و همچنین بهینه‌سازی‌های احتمالی در باندل‌کننده‌ها کمک می‌کند.

// import { someValue } from "./some-module.json" with { type: "json" }; // مثال آینده‌نگر برای JSON modules
import { SomeType } from "./some-module.d.ts" with { "resolution-mode": "type" }; // مثال برای resolution-mode
    

• Narrowing برای دسترسی به ویژگی‌های super (Narrowing for super Property Access): TypeScript 5.3 بهبودهایی در narrowing برای دسترسی به ویژگی‌های super در کلاس‌ها اعمال کرد. این بدان معناست که TypeScript اکنون می‌تواند با دقت بیشتری تشخیص دهد که آیا یک ویژگی در کلاس پایه (superclass) تعریف شده است یا خیر، که منجر به بررسی‌های نوع دقیق‌تر می‌شود.

TypeScript 5.4: تکمیل و بهبودهای عملکردی

TypeScript 5.4 به تکمیل ویژگی‌های 5.x ادامه داد و شامل چندین بهبود قابل توجه در استنتاج نوع و عملکرد بود:

• Narrowing برای پارامترهای نوع const (Narrowing for const Type Parameters): این ویژگی، که بر پایه پارامترهای نوع const معرفی شده در TS 5.0 است، اجازه می‌دهد تا TypeScript بتواند نوع این پارامترها را در داخل بلوک‌های کد Narrow کند. این امر به دقت بیشتر در بررسی نوع در توابعی که از این پارامترها استفاده می‌کنند، کمک می‌کند.

function processData<const T>(data: T) {
    if (typeof data === 'object' && data !== null && 'value' in data) {
        // در اینجا TypeScript نوع 'data' را به 'T & { value: unknown }' (یا دقیق تر) Narrow می کند.
        console.log(data.value);
    }
}

const myData = { value: 42, label: 'test' };
processData(myData);
    

• استنتاج دقیق‌تر انواع بازگشتی void و undefined (More Accurate Inference for void and undefined Return Types): TypeScript 5.4 استنتاج نوع بازگشتی توابع را بهبود بخشید، به خصوص زمانی که یک تابع به طور صریح یا ضمنی void یا undefined را برمی‌گرداند. این به جلوگیری از خطاهای نوعی ناخواسته و افزایش دقت سیستم نوع‌بندی کمک می‌کند.
• حفظ نوع this در Promise.all و Promise.race: در نسخه‌های قبلی، زمانی که از Promise.all یا Promise.race با توابع متدی استفاده می‌شد که به this نیاز داشتند، نوع this ممکن بود از بین برود. TypeScript 5.4 این مشکل را حل کرد و اطمینان حاصل کرد که نوع this به درستی حفظ می‌شود، که به خصوص برای کتابخانه‌هایی که از توابع متدی استفاده می‌کنند، مفید است.
• بهبود نوع‌بندی Object.groupBy و Map.groupBy: پشتیبانی از Object.groupBy و Map.groupBy در TS 5.2 معرفی شد، اما در TS 5.4 نوع‌بندی این متدها بهبود یافت تا دقت بیشتری در استنتاج نوع گروه‌های تولید شده داشته باشد، به خصوص در مورد کلیدهای گروه‌بندی.
• نوع ابزاری NoInfer (NoInfer Utility Type): این یک نوع ابزاری جدید است که از استنتاج نوع یک پارامتر نوع در یک موقعیت خاص جلوگیری می‌کند. این بسیار مفید است زمانی که می‌خواهید کنترل دقیق‌تری بر نحوه استنتاج انواع در توابع جنریک داشته باشید و از “گسترش بیش از حد” انواع جلوگیری کنید.

type NoInfer<T> = [T][T extends any ? 0 : never];

// مثال: فرض کنید می خواهید یک تابع generic بنویسید
// اما نمی خواهید نوع 'T' از آرگومان 'callback' استنتاج شود.
function createHandler<T>(initialValue: T, callback: (value: NoInfer<T>) => void) {
    callback(initialValue);
}

// در اینجا، 'T' از initialValue (یعنی 10) به 'number' استنتاج می شود.
// بدون NoInfer، اگر callback دارای آرگومان string بود، T به string | number تبدیل می شد.
createHandler(10, (value) => {
    // value اینجا از نوع 'number' است و نه 'any' یا 'unknown'
    console.log(value + 5);
});
    

• بهبودهای عملکردی: مانند هر نسخه جدید، TypeScript 5.4 نیز شامل بهبودهای عملکردی در کامپایلر بود، از جمله بهینه‌سازی در caching فایل‌ها و بهبود سرعت در حالت --build (project references) که به خصوص در monorepo های بزرگ محسوس است.

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

دکوراتورها در TypeScript 5.x: استانداردسازی و قدرت‌بخشی

همانطور که در بررسی TypeScript 5.0 اشاره شد، بازسازی و استانداردسازی دکوراتورها یکی از برجسته‌ترین ویژگی‌های سری 5.x است. این تغییر نه تنها یک به‌روزرسانی سینتکسی ساده نیست، بلکه یک تغییر عمیق در فلسفه و توانایی‌های دکوراتورها محسوب می‌شود. برای درک کامل اهمیت این تغییر، باید به جزئیات بیشتری از نحوه عملکرد دکوراتورهای جدید و کاربردهای آن‌ها بپردازیم.

چرا دکوراتورها بازسازی شدند؟

دکوراتورهای قدیمی (که قبل از TS 5.0 استفاده می‌شدند) بر اساس یک طرح اولیه (proposal stage 2) برای ECMAScript بودند. این طرح در طول زمان تکامل یافت و تغییرات قابل توجهی در نحوه عملکرد و API دکوراتورها ایجاد شد. برای اینکه TypeScript بتواند با استاندارد آینده جاوااسکریپت همگام شود و به توسعه‌دهندگان اطمینان دهد که کدهایشان در آینده نیز معتبر خواهند بود، نیاز به تطبیق با طرح جدید (proposal stage 3) بود.

دکوراتورهای جدید قدرتمندتر، انعطاف‌پذیرتر و قابل ترکیب‌تر هستند. آن‌ها از یک “گردش کار دو مرحله‌ای” استفاده می‌کنند: دکوراتورها یک descriptor یا initializer را برمی‌گردانند که سپس در زمان تعریف کلاس یا ویژگی، برای تغییر رفتار شی مورد نظر اعمال می‌شود. این رویکرد به شما اجازه می‌دهد تا عملیات پیچیده‌تری را انجام دهید که با دکوراتورهای قدیمی ممکن نبود.

انواع دکوراتورهای جدید و کاربرد آن‌ها

دکوراتورهای جدید می‌توانند بر روی عناصر مختلفی اعمال شوند:

1. دکوراتورهای کلاس (Class Decorators)

این دکوراتورها بر روی تعریف یک کلاس اعمال می‌شوند و می‌توانند رفتار کلاس را تغییر دهند یا یک کلاس جدید را برگردانند که از کلاس اصلی ارث‌بری می‌کند.

function LogConstructor(constructor: Function, context: ClassDecoratorContext) {
    console.log(`Class ${context.name} constructed.`);
    return class extends (constructor as any) {
        constructor(...args: any[]) {
            super(...args);
            console.log(`Instance of ${context.name} created.`);
        }
    };
}

@LogConstructor
class Product {
    name: string;
    constructor(name: string) {
        this.name = name;
    }
}

new Product('Laptop');
// خروجی:
// Class Product constructed.
// Instance of Product created.

2. دکوراتورهای متد (Method Decorators)

این دکوراتورها بر روی متدهای یک کلاس اعمال می‌شوند و می‌توانند رفتار متد را تغییر دهند، آن را لاگ کنند، ورودی‌ها را اعتبارسنجی کنند و غیره. آن‌ها یک descriptor را برمی‌گردانند که حاوی متد اصلی است.

function LogMethod(target: Function, context: ClassMethodDecoratorContext) {
    const methodName = String(context.name);
    return function (this: any, ...args: any[]) {
        console.log(`Calling method ${methodName} with args: ${JSON.stringify(args)}`);
        const result = target.apply(this, args);
        console.log(`Method ${methodName} returned: ${result}`);
        return result;
    };
}

class Calculator {
    @LogMethod
    add(a: number, b: number): number {
        return a + b;
    }
}

const calc = new Calculator();
calc.add(5, 3);
// خروجی:
// Calling method add with args: [5,3]
// Method add returned: 8

3. دکوراتورهای ویژگی (Property Decorators)

این دکوراتورها بر روی ویژگی‌های یک کلاس اعمال می‌شوند (نه getter/setter ها) و می‌توانند رفتار آن‌ها را تغییر دهند. آن‌ها یک initializer را برمی‌گردانند که هنگام مقداردهی اولیه ویژگی فراخوانی می‌شود.

function DefaultValue(defaultValue: any) {
    return function (target: undefined, context: ClassFieldDecoratorContext) {
        if (context.kind === 'field') {
            return function (initialValue: any) {
                return initialValue === undefined ? defaultValue : initialValue;
            };
        }
        return target; // برای انواع دیگر (اگر target مقداردهی شده باشد)
    };
}

class Settings {
    @DefaultValue('anonymous')
    userName: string;

    @DefaultValue(1)
    version: number;

    constructor(userName?: string, version?: number) {
        this.userName = userName;
        this.version = version;
    }
}

const user1 = new Settings();
console.log(user1.userName); // خروجی: anonymous
console.log(user1.version); // خروجی: 1

const user2 = new Settings('JohnDoe', 2);
console.log(user2.userName); // خروجی: JohnDoe
console.log(user2.version); // خروجی: 2

4. دکوراتورهای Accessor (Getter/Setter) (TS 5.1+)

همانطور که در بخش TS 5.1 ذکر شد، این دکوراتورها بر روی متدهای get و set اعمال می‌شوند و امکان لاگ‌گیری، اعتبارسنجی یا تغییر رفتار دسترسی به ویژگی‌ها را فراهم می‌کنند.

// مثال در بخش TS 5.1 پوشش داده شده است.

ClassMemberDecoratorContext

دکوراتورهای جدید از یک شی context استفاده می‌کنند که اطلاعات مفیدی در مورد عنصری که در حال تزئین است ارائه می‌دهد. این شی دارای ویژگی‌هایی مانند name (نام عضو), kind (نوع عضو: ‘method’, ‘field’, ‘accessor’, ‘getter’, ‘setter’), static (آیا عضو استاتیک است), و private (آیا عضو private است) است.

این اطلاعات به شما امکان می‌دهد تا دکوراتورهای عمومی‌تری بنویسید که بتوانند بر روی انواع مختلفی از اعضای کلاس اعمال شوند و رفتار خود را بر اساس نوع عضو تنظیم کنند.

مهاجرت از دکوراتورهای قدیمی

مهاجرت از دکوراتورهای قدیمی به جدید نیازمند بازنویسی قابل توجهی است زیرا API و الگوی آن‌ها کاملاً متفاوت است. ابزارهایی مانند ts-migrate ممکن است برای کمک به بخش‌هایی از این فرآیند مفید باشند، اما بخش زیادی از آن به بازنویسی دستی منطق دکوراتورها نیاز دارد.

نکات کلیدی مهاجرت:

• تغییر امضای توابع دکوراتور: دکوراتورهای قدیمی پارامترهای مختلفی (target, propertyKey, descriptor) را دریافت می‌کردند. دکوراتورهای جدید یک تابع را به عنوان اولین آرگومان و یک شی context را به عنوان دومین آرگومان دریافت می‌کنند.
• بازگشت مقادیر: دکوراتورهای کلاس قدیمی می‌توانستند یک کلاس جدید را مستقیماً برگردانند. دکوراتورهای کلاس جدید نیز همین کار را می‌کنند اما دکوراتورهای متد، ویژگی و accessor اکنون یک descriptor یا یک initializer را برمی‌گردانند.
• پشتیبانی از emitDecoratorMetadata: این پرچم برای فریم‌ورک‌هایی مانند Angular که به ابرداده‌های زمان اجرا (runtime metadata) نیاز دارند، همچنان پشتیبانی می‌شود، اما نحوه تولید این ابرداده‌ها با دکوراتورهای جدید متفاوت است.

چالش‌ها و مزایا

چالش‌ها:

• نیاز به بازنویسی کد برای پروژه‌هایی که از دکوراتورهای قدیمی استفاده می‌کنند.
• پیچیدگی بیشتر در درک API جدید دکوراتورها در مقایسه با سادگی ظاهری دکوراتورهای قدیمی.

مزایا:

• استانداردسازی: همگام‌سازی با استاندارد آینده ECMAScript، اطمینان از طول عمر کد.
• قدرتمندتر و منعطف‌تر: امکان انجام عملیات پیچیده‌تر با دکوراتورها (مانند تغییر کامل رفتار یک متد یا ویژگی).
• قابلیت ترکیب بهتر: طراحی جدید دکوراتورها به آن‌ها اجازه می‌دهد تا با یکدیگر ترکیب شوند و رفتار پیش‌بینی‌پذیرتری داشته باشند.
• پشتیبانی از accessor properties: امکان تزئین getter و setter ها که در دکوراتورهای قدیمی به این شکل استاندارد وجود نداشت.

دکوراتورهای جدید در TypeScript 5.x ابزار قدرتمندی را برای توسعه‌دهندگان فراهم می‌کنند که به آن‌ها اجازه می‌دهد کد خود را به روشی سازمان‌یافته‌تر، قابل نگهداری‌تر و ماژولارتر توسعه دهند. در حالی که مهاجرت ممکن است چالش‌برانگیز باشد، مزایای بلندمدت آن از نظر استانداردسازی و قابلیت‌های توسعه، این تلاش را توجیه می‌کند.

مدیریت منابع صریح با using Declarations (TypeScript 5.2)

یکی از مشکلات رایج در برنامه‌نویسی، فراموش کردن آزاد کردن منابعی است که پس از استفاده، دیگر مورد نیاز نیستند. این منابع می‌توانند شامل فایل‌ها، اتصالات شبکه، قفل‌های پایگاه داده، یا هر منبع دیگری باشند که برای جلوگیری از نشت حافظه (memory leaks)، قفل‌های غیرضروری (deadlocks) یا اشغال منابع سیستم، باید به درستی بسته یا آزاد شوند.

در جاوااسکریپت و تایپ اسکریپت، معمولاً برای مدیریت این منابع از الگوهایی مانند بلوک‌های try...finally استفاده می‌شود. با این حال، این الگوها می‌توانند منجر به کدهای تکراری و پیچیده شوند، به خصوص زمانی که چندین منبع باید به طور متوالی مدیریت شوند. TypeScript 5.2 با معرفی اعلان‌های using (و await using برای منابع ناهمگام)، یک راه‌حل استاندارد و تمیز برای این مشکل ارائه داد.

using Declarations چیست؟

اعلان using یک پیشنهاد ECMAScript (که در مرحله 3 استاندارد قرار دارد) است که به طور مستقیم در TypeScript 5.2 پیاده‌سازی شده است. این ویژگی به شما اجازه می‌دهد تا منابعی را که نیاز به “آزاد شدن” دارند، به صورت واضح و مختصر تعریف کنید. هنگامی که اجرای کد از اسکوپ (Scope) ی که متغیر using در آن تعریف شده است خارج می‌شود (چه به صورت طبیعی، چه با return، throw، break یا continue)، متد خاصی بر روی آن منبع به طور خودکار فراخوانی می‌شود تا آن را آزاد کند.

این ویژگی بر اساس دو پروتکل جدید JavaScript بنا شده است:

• Symbol.dispose: برای منابع همگام (Synchronous)
• Symbol.asyncDispose: برای منابع ناهمگام (Asynchronous)

پروتکل Disposable و AsyncDisposable

برای اینکه یک شی بتواند با using کار کند، باید پروتکل Disposable (یا AsyncDisposable) را پیاده‌سازی کند. این بدان معناست که شی باید یک متد با نام [Symbol.dispose]() (یا [Symbol.asyncDispose]()) داشته باشد که هیچ آرگومانی نمی‌گیرد و هیچ مقداری را بر نمی‌گرداند (void). این متد شامل منطق پاکسازی یا آزاد کردن منبع است.

مثال Disposable (با using):

// تعریف اینترفیس Disposable برای وضوح بیشتر
interface Disposable {
    [Symbol.dispose](): void;
}

class DatabaseConnection implements Disposable {
    constructor(public connectionId: number) {
        console.log(`Connecting to database with ID: ${connectionId}`);
    }

    query(sql: string): void {
        console.log(`Executing query "${sql}" on connection ${this.connectionId}`);
    }

    [Symbol.dispose](): void {
        console.log(`Disconnecting from database with ID: ${this.connectionId}`);
    }
}

function performDatabaseOperations() {
    using dbConn = new DatabaseConnection(123); // 'using' declaration
    dbConn.query("SELECT * FROM users;");
    dbConn.query("INSERT INTO logs (message) VALUES ('Data accessed');");
    // وقتی تابع به پایان برسد، یا با return/throw خارج شود، dbConn[Symbol.dispose]() به طور خودکار فراخوانی می شود.
}

performDatabaseOperations();
// خروجی:
// Connecting to database with ID: 123
// Executing query "SELECT * FROM users;" on connection 123
// Executing query "INSERT INTO logs (message) VALUES ('Data accessed');" on connection 123
// Disconnecting from database with ID: 123

در مثال بالا، نیازی به فراخوانی صریح disconnect() یا قرار دادن آن در بلوک finally نیست. کامپایلر TypeScript (و در نهایت موتور جاوااسکریپت) تضمین می‌کند که [Symbol.dispose]() در پایان اسکوپ فراخوانی می‌شود.

await using برای منابع ناهمگام (Asynchronous Resources)

بسیاری از عملیات ورودی/خروجی (I/O) در جاوااسکریپت ناهمگام هستند، مانند خواندن فایل‌ها یا درخواست‌های شبکه. برای این منابع، پروتکل AsyncDisposable و اعلان await using معرفی شده است.

یک شی برای اینکه AsyncDisposable باشد، باید متد [Symbol.asyncDispose]() را پیاده‌سازی کند که یک Promise<void> را برمی‌گرداند.

مثال AsyncDisposable (با await using):

interface AsyncDisposable {
    [Symbol.asyncDispose](): Promise<void>;
}

class NetworkClient implements AsyncDisposable {
    constructor(public url: string) {
        console.log(`Opening connection to ${url}`);
    }

    async sendRequest(data: string): Promise<string> {
        console.log(`Sending data: ${data}`);
        await new Promise(resolve => setTimeout(resolve, 500)); // شبیه‌سازی عملیات ناهمگام
        return `Response from ${this.url} for ${data}`;
    }

    async [Symbol.asyncDispose](): Promise<void> {
        console.log(`Closing connection to ${this.url}`);
        await new Promise(resolve => setTimeout(resolve, 200)); // شبیه‌سازی عملیات ناهمگام
    }
}

async function fetchUserData(apiUrl: string) {
    await using client = new NetworkClient(apiUrl); // 'await using' declaration
    const response1 = await client.sendRequest("user_info");
    console.log(response1);
    const response2 = await client.sendRequest("user_settings");
    console.log(response2);
    // در اینجا، وقتی تابع 'fetchUserData' به پایان برسد،
    // client[Symbol.asyncDispose]() به طور خودکار و await-شده فراخوانی می شود.
}

fetchUserData("https://api.example.com/data");
// خروجی:
// Opening connection to https://api.example.com/data
// Sending data: user_info
// Response from https://api.example.com/data for user_info
// Sending data: user_settings
// Response from https://api.example.com/data for user_settings
// Closing connection to https://api.example.com/data

مزایای using Declarations

• وضوح کد (Clarity): کد تمیزتر و خواناتر می‌شود، زیرا منطق پاکسازی از منطق اصلی عملیات جدا می‌شود.
• قابلیت اطمینان (Reliability): تضمین می‌کند که منابع حتی در صورت بروز خطا (مانند پرتاب استثنا) به درستی آزاد می‌شوند. نیازی به بلوک‌های try...finally پیچیده نیست.
• کاهش کد تکراری (Reduced Boilerplate): از نوشتن مکرر کدهای پاکسازی تکراری جلوگیری می‌کند.
• کاهش نشت منابع (Reduced Resource Leaks): به طور خودکار منابع را آزاد می‌کند، که به جلوگیری از نشت حافظه و سایر مشکلات مربوط به منابع کمک می‌کند.
• پشتیبانی از پروتکل استاندارد: با پیروی از پروتکل‌های استاندارد ECMAScript، این ویژگی می‌تواند توسط هر کتابخانه یا فریم‌ورکی که نیاز به مدیریت منابع دارد، پیاده‌سازی شود.

محدودیت‌ها و ملاحظات

• اعلان‌های using فقط برای متغیرهایی کار می‌کنند که می‌توانند در زمان کامپایل (یا در زمان اجرا) تعیین شوند که Disposable یا AsyncDisposable هستند.
• آن‌ها برای مدیریت منابعی که به صورت “یک بار مصرف” (one-time use) هستند، ایده‌آل هستند و نه برای منابعی که باید به طور مداوم باز و بسته شوند.
• در محیط‌های قدیمی‌تر جاوااسکریپت که از این ویژگی پشتیبانی نمی‌کنند، نیاز به ترانس‌پایلر (Transpiler) مناسب (مانند Babel یا خود TypeScript) برای تبدیل کد به سینتکس قدیمی‌تر وجود دارد.

اعلان‌های using یک افزودنی بسیار مهم و قدرتمند به TypeScript (و در نهایت به جاوااسکریپت) هستند. آن‌ها به توسعه‌دهندگان کمک می‌کنند تا کدهای قابل اطمینان‌تری بنویسند و نگرانی‌های مربوط به مدیریت منابع را به طور خودکار و کارآمدتری حل کنند.

بهبودهای عملکردی و تجربه توسعه‌دهنده در TypeScript 5.x

علاوه بر معرفی ویژگی‌های جدید، تیم TypeScript همواره در تلاش بوده تا عملکرد کامپایلر و تجربه کلی توسعه‌دهنده را بهبود بخشد. سری 5.x تایپ اسکریپت در این زمینه نیز پیشرفت‌های چشمگیری داشته است که به سرعت بخشیدن به فرآیند توسعه و کاهش سربار ذهنی کمک می‌کند.

1. بهینه‌سازی سرعت کامپایل (Compilation Speed Optimization)

یکی از مهمترین حوزه‌های بهبود در TypeScript 5.x، سرعت کامپایل است. در پروژه‌های بزرگ و پیچیده، زمان کامپایل می‌تواند به یک گلوگاه تبدیل شود. TypeScript 5.x چندین بهینه‌سازی را برای کاهش این زمان پیاده‌سازی کرده است:

• بازسازی ساختار داده‌های داخلی: تیم TypeScript بسیاری از ساختارهای داده داخلی کامپایلر را بازسازی کرده و از Map ها و Set ها به جای Object ها در جاهایی که مناسب‌تر هستند، استفاده کرده است. این تغییرات منجر به جستجوهای سریع‌تر و مصرف حافظه کمتر می‌شود.
• بهینه‌سازی در حل ماژول‌ها: معرفی moduleResolution bundler در TS 5.0 و بهبودهای بعدی در آن، نحوه حل ماژول‌ها را با رویکرد باندل‌کننده‌های مدرن هماهنگ‌تر کرده است. این امر باعث می‌شود که TypeScript زمان کمتری را صرف جستجوی فایل‌ها و حل وابستگی‌ها کند.
• بهبود caching و Incremental Builds: در TS 5.4 و نسخه‌های قبلی، بهبودهایی در سیستم caching داخلی کامپایلر و نحوه کارکرد Incremental Builds (ساخت‌های افزایشی) اعمال شده است. این به خصوص در سناریوهای --build (project references) که پروژه‌ها به یکدیگر وابسته هستند، به کاهش زمان کامپایل کمک می‌کند، زیرا TypeScript می‌تواند بخش‌هایی را که تغییر نکرده‌اند، نادیده بگیرد.
• کاهش سربار تولید فایل‌های .d.ts: بهینه‌سازی‌هایی در نحوه تولید فایل‌های تعریفی (.d.ts) انجام شده است که به کاهش زمان لازم برای این فرآیند کمک می‌کند.

این بهینه‌سازی‌ها در مجموع منجر به کاهش قابل توجهی در زمان کامپایل شده‌اند که در برخی سناریوها تا 10-20% یا بیشتر گزارش شده است. این امر به ویژه برای توسعه‌دهندگانی که با پروژه‌های بزرگ کار می‌کنند، بسیار ارزشمند است.

2. کاهش حجم بسته نصبی (Reduced Package Size)

TypeScript 5.0 با یک تغییر بزرگ در ساختار داخلی، حجم بسته نصبی (package size) خود را به شدت کاهش داد. این تغییر شامل مهاجرت از کامپایلر نوشته شده در جاوااسکریپت به جاوااسکریپت تولید شده توسط TypeScript بود و استفاده از ساختارهای داده بومی جاوااسکریپت (مانند Map و Set) به جای شبیه‌سازی آن‌ها. این امر منجر به کاهش قابل توجهی در فضای دیسک مورد نیاز و زمان نصب (به خصوص در محیط‌های CI/CD) می‌شود.

به عنوان مثال، در TypeScript 5.0، حجم بسته نصبی تقریباً 25% کاهش یافت که یک دستاورد بزرگ محسوب می‌شود.

3. بهبود تجربه IDE و ویرایشگر (Improved IDE and Editor Experience)

تایپ اسکریپت فقط یک کامپایلر نیست، بلکه یک سرویس زبان (language service) قوی نیز ارائه می‌دهد که توسط ویرایشگرهای کد مانند VS Code، WebStorm و غیره استفاده می‌شود. بهبودهای عملکردی در کامپایلر به طور مستقیم بر تجربه ویرایشگر نیز تأثیر می‌گذارد:

• پاسخگویی سریع‌تر: بررسی‌های نوع، پیشنهادات تکمیل خودکار، و Refactoring ها (بازسازی کد) سریع‌تر انجام می‌شوند. این به معنای تأخیر کمتر در زمان کدنویسی است.
• دقت بالاتر در تشخیص خطاها: بهبودهای سیستم نوع‌بندی در 5.x منجر به تشخیص دقیق‌تر و هوشمندانه‌تر خطاها در زمان واقعی می‌شود، قبل از اینکه کد حتی کامپایل شود.
• نویگیشن بهتر: قابلیت‌های Go-to-Definition و Find-All-References بهبود یافته‌اند، که نویگیشن در کدهای پیچیده را آسان‌تر می‌کند.
• پشتیبانی از ویژگی‌های جدید: ویرایشگرها می‌توانند به سرعت از ویژگی‌های جدید زبان مانند دکوراتورهای استاندارد و using declarations پشتیبانی کنند، که به توسعه‌دهندگان امکان می‌دهد از این قابلیت‌ها به طور کامل بهره‌مند شوند.

4. پیام‌های خطای بهبود یافته (Better Error Messages)

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

5. پشتیبانی بهتر از ESM (ECMAScript Modules)

با حرکت اکوسیستم جاوااسکریپت به سمت ESM، TypeScript 5.x پشتیبانی خود را از این ماژول‌ها به شکل قابل توجهی بهبود بخشیده است. این شامل moduleResolution bundler، پرچم --verbatimModuleSyntax و بهبود حل import type است. این تغییرات به توسعه‌دهندگان کمک می‌کند تا پروژه‌های ESM را با TypeScript به راحتی و بدون مشکلات حل ماژول رایج، مدیریت کنند.

خلاصه بهبودهای DX:

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

نحوه ارتقاء و نکات مهاجرت به TypeScript 5.x

ارتقاء به نسخه‌های جدید TypeScript، به خصوص سری 5.x که شامل تغییرات قابل توجهی مانند دکوراتورهای استاندارد و moduleResolution bundler است، نیازمند دقت و برنامه‌ریزی است. در حالی که TypeScript به سازگاری با عقب (backward compatibility) اهمیت زیادی می‌دهد، گاهی اوقات تغییرات ناگوار (breaking changes) یا تغییرات در رفتار پیش‌فرض (default behavior) ضروری است.

1. به‌روزرسانی TypeScript

اولین گام برای ارتقاء، به‌روزرسانی بسته TypeScript در پروژه شما است. این کار را می‌توانید با استفاده از npm یا yarn انجام دهید:

npm install typescript@latest
# یا
yarn add typescript@latest

پس از نصب، می‌توانید از npx tsc -v یا yarn tsc -v برای اطمینان از نصب نسخه صحیح استفاده کنید.

2. به‌روزرسانی tsconfig.json

برخی از ویژگی‌ها و بهبودها در TypeScript 5.x نیاز به تغییراتی در فایل tsconfig.json دارند. نکات کلیدی:

• target: اگر از ویژگی‌های جدید ECMAScript مانند using declarations استفاده می‌کنید، مطمئن شوید که target شما به ES2022 یا بالاتر تنظیم شده باشد. برای دکوراتورها، target به طور مستقیم بر نحوه تولید خروجی تأثیر نمی‌گذارد (useDefineForClassFields مهم‌تر است).
• moduleResolution: اکیداً توصیه می‌شود که "moduleResolution": "bundler" را در compilerOptions خود تنظیم کنید، به خصوص اگر از باندل‌کننده‌های مدرن مانند Webpack, Rollup, Parcel, Vite, یا esbuild استفاده می‌کنید. این تنظیم می‌تواند بسیاری از مشکلات مربوط به حل ماژول را برطرف کند.

  
  {
    "compilerOptions": {
      "moduleResolution": "bundler",
      "target": "es2022", // یا بالاتر
      // ... سایر گزینه ها
    }
  }
          

• useDefineForClassFields: این پرچم در TS 5.0 به طور پیش‌فرض به true تغییر یافت، مگر اینکه target شما کمتر از ES2022 باشد و experimentalDecorators یا emitDecoratorMetadata فعال باشد. این تغییر بر نحوه تولید فیلدهای کلاس تأثیر می‌گذارد و برای سازگاری با رفتار استاندارد ES2022 مهم است. اگر با فریم‌ورک‌هایی مانند React Native یا فریم‌ورک‌های قدیمی‌تر که به رفتار قدیمی classFields وابسته‌اند مشکل دارید، ممکن است نیاز باشد آن را به false تنظیم کنید، اما این کار توصیه نمی‌شود و بهتر است فریم‌ورک یا کد خود را به‌روزرسانی کنید تا با رفتار جدید سازگار شود.
• skipLibCheck: اگر با مشکلات نوع‌بندی در node_modules مواجه شدید، می‌توانید به طور موقت "skipLibCheck": true را اضافه کنید (اگر قبلاً آن را ندارید)، اما این یک راه‌حل موقت است و بهتر است وابستگی‌های خود را به‌روزرسانی کنید.
• verbatimModuleSyntax (TypeScript 5.3+): اگر می‌خواهید کنترل دقیق‌تری بر خروجی ماژول‌های خود داشته باشید و از حذف import type یا تبدیل‌های ناخواسته جلوگیری کنید، این پرچم را به true تنظیم کنید.

3. مهاجرت دکوراتورها (اگر استفاده می‌کنید)

این بزرگترین تغییر ناگوار در TypeScript 5.x است. اگر در پروژه خود از دکوراتورهای قدیمی (با "experimentalDecorators": true) استفاده می‌کنید، باید آن‌ها را به دکوراتورهای استاندارد ECMAScript تبدیل کنید. این فرآیند ممکن است زمان‌بر باشد:

• درک API جدید: همانطور که در بخش دکوراتورها توضیح داده شد، امضا و رفتار دکوراتورهای جدید متفاوت است. باید منطق دکوراتورهای خود را بر این اساس بازنویسی کنید.
• تغییرات tsconfig.json: برای استفاده از دکوراتورهای جدید، نیازی به "experimentalDecorators": true نیست. در واقع، این پرچم نباید همزمان با دکوراتورهای جدید استفاده شود. مطمئن شوید که این پرچم را حذف کرده‌اید.
• ابزارهای مهاجرت: متاسفانه، ابزار خودکار کاملی برای مهاجرت دکوراتورهای قدیمی به جدید وجود ندارد، زیرا تغییرات بنیادین هستند. ممکن است لازم باشد دکوراتورها را به صورت دستی بازنویسی کنید یا از ابزارهای کمکی مانند ts-migrate برای شناسایی موارد استفاده کمک بگیرید.

اگر پروژه شما از فریم‌ورکی مانند Angular استفاده می‌کند که به شدت به دکوراتورها وابسته است، مطمئن شوید که نسخه فریم‌ورک شما با TypeScript 5.x و دکوراتورهای استاندارد سازگار است. فریم‌ورک‌ها و کتابخانه‌ها به تدریج به دکوراتورهای جدید مهاجرت می‌کنند.

4. رسیدگی به پیام‌های خطا جدید

با هر نسخه جدید، TypeScript ممکن است بررسی‌های نوع سخت‌گیرانه‌تری را اعمال کند یا باگ‌های موجود در سیستم نوع‌بندی را برطرف کند که ممکن است منجر به ظهور خطاهای جدیدی در کد شما شود. این خطاها معمولاً نشان‌دهنده مشکلات واقعی در نوع‌بندی هستند که قبلاً نادیده گرفته می‌شدند. برای رسیدگی به آن‌ها:

• خواند پیام خطا: پیام‌های خطای جدید معمولاً اطلاعات دقیق‌تری ارائه می‌دهند. آن‌ها را به دقت بخوانید.
• بررسی مستندات: برای هر تغییر ناگوار یا رفتار جدید، مستندات رسمی TypeScript را بررسی کنید. Release Notes هر نسخه معمولاً لیست کاملی از تغییرات ناگوار را شامل می‌شود.
• رفع خطاهای نوع: کد خود را بر اساس خطاهای گزارش شده اصلاح کنید. این ممکن است شامل افزودنassertion های نوع (Type assertions)، تعریف دقیق‌تر انواع یا تغییر منطق کد باشد.

5. بروزرسانی وابستگی‌ها (Dependencies)

بسیار مهم است که تمامی وابستگی‌های پروژه خود (کتابخانه‌ها و فریم‌ورک‌ها) را به آخرین نسخه‌های سازگار با TypeScript 5.x به‌روزرسانی کنید. بسیاری از کتابخانه‌ها برای بهره‌مندی کامل از ویژگی‌های جدید یا حل مشکلات سازگاری، نیاز به به‌روزرسانی دارند. به خصوص به کتابخانه‌هایی که به شدت به سیستم نوع‌بندی TypeScript وابسته هستند (مثل React, Angular, Vue, Redux, Zod, TanStack Query و …) توجه کنید.

npm update # یا yarn upgrade

6. تست و تأیید

پس از هر ارتقاء، به خصوص به یک نسخه اصلی مانند 5.x، اجرای کامل مجموعه تست‌های پروژه شما ضروری است. این کار به شناسایی هر گونه مشکل ناخواسته یا رگرسیون کمک می‌کند. اطمینان حاصل کنید که محیط توسعه (Development Environment) و محیط ساخت (Build Environment) شما با نسخه جدید TypeScript سازگار است.

ارتقاء به TypeScript 5.x یک سرمایه‌گذاری است که در بلندمدت با کد پایدارتر، کارایی بالاتر و بهره‌وری بهتر توسعه‌دهنده نتیجه می‌دهد. با دنبال کردن این مراحل و توجه به جزئیات، می‌توانید یک فرآیند مهاجرت روان داشته باشید.

نتیجه‌گیری: آینده TypeScript و تأثیر 5.x

سری 5.x تایپ اسکریپت، از نسخه 5.0 تا 5.4 و فراتر از آن، نشان‌دهنده یک دوره رشد و تکامل چشمگیر برای این زبان است. این نسخه‌ها نه تنها قابلیت‌های جدید و قدرتمندی را معرفی کرده‌اند، بلکه بر روی بهینه‌سازی‌های عملکردی و بهبود تجربه توسعه‌دهنده نیز تأکید داشته‌اند، که همگی به سمت یک هدف مشترک حرکت می‌کنند: ساختن جاوااسکریپت به عنوان یک زبان برنامه‌نویسی امن‌تر، کارآمدتر و قابل نگهداری‌تر برای پروژه‌های در هر اندازه و پیچیدگی.

بازتعریف پارادایم‌ها با دکوراتورهای استاندارد: شاید مهمترین ویژگی سری 5.x، بازسازی جامع دکوراتورها باشد. این تغییر، که در ابتدا ممکن است چالش‌برانگیز به نظر برسد، تایپ اسکریپت را با استاندارد در حال تکامل ECMAScript همگام می‌کند. این همگام‌سازی نه تنها تضمین‌کننده پایداری و طول عمر کد در آینده است، بلکه قدرت و انعطاف‌پذیری بی‌سابقه‌ای را در تزئین و تغییر رفتار کلاس‌ها و اعضای آن‌ها فراهم می‌آورد. دکوراتورهای جدید، به توسعه‌دهندگان اجازه می‌دهند تا الگوهای طراحی پیچیده‌تر و ماژولارتر را با اطمینان بیشتری پیاده‌سازی کنند.

مدیریت منابع بهینه با using Declarations: معرفی اعلان‌های using و await using در TypeScript 5.2 یک گام بزرگ رو به جلو در مدیریت منابع است. این ویژگی، با الهام از زبان‌های برنامه‌نویسی دیگر، راهی تمیز و قابل اطمینان برای تضمین آزاد شدن منابع پس از استفاده ارائه می‌دهد. این امر به کاهش نشت منابع، بهبود پایداری برنامه و ساده‌سازی کدهای مربوط به پاکسازی کمک شایانی می‌کند، که برای توسعه‌دهندگان در مواجهه با سیستم‌های فایل، اتصالات شبکه و سایر منابع سیستمی حیاتی است.

بهبودهای مداوم در عملکرد و تجربه توسعه‌دهنده: جدای از ویژگی‌های اصلی، تمرکز مداوم بر روی افزایش سرعت کامپایل، کاهش حجم بسته نصبی و بهبود ابزارهای سرویس زبان، نشان‌دهنده تعهد تیم TypeScript به بهبود بهره‌وری روزمره توسعه‌دهندگان است. زمان‌های کامپایل کوتاه‌تر و تجربه IDE روان‌تر، به معنای بازخورد سریع‌تر و جریان کاری کارآمدتر است، که به خصوص در پروژه‌های بزرگ و پیچیده تأثیر بسزایی دارد.

آینده‌نگری و همگام‌سازی با ECMAScript: TypeScript 5.x به طور مداوم تلاش کرده است تا پیش‌نویس‌های جدید ECMAScript را در خود جای دهد، از جمله moduleResolution bundler، Object.groupBy، Map.groupBy و سایر بهبودهای سینتکسی. این رویکرد به توسعه‌دهندگان اجازه می‌دهد تا از جدیدترین قابلیت‌های زبان جاوااسکریپت در محیط تایپ شده بهره‌مند شوند، در حالی که TypeScript مسئولیت پیچیدگی‌های سازگاری و ترانس‌پایلینگ را بر عهده می‌گیرد.

در نهایت، TypeScript 5.x نه تنها یک به‌روزرسانی برای افزودن قابلیت‌های جدید است، بلکه یک گام مهم در جهت بلوغ و تثبیت تایپ اسکریپت به عنوان یک ابزار توسعه وب ضروری و قدرتمند است. با هر نسخه جدید، TypeScript به جامعه توسعه‌دهندگان این اطمینان را می‌دهد که آن‌ها ابزاری در اختیار دارند که نه تنها به آن‌ها کمک می‌کند تا کدهای با کیفیت‌تری بنویسند، بلکه به طور مداوم در حال تکامل و همگام‌سازی با نیازهای آینده توسعه نرم‌افزار است. مهاجرت به TypeScript 5.x یک سرمایه‌گذاری ارزشمند برای هر پروژه مدرن جاوااسکریپت و تایپ اسکریپت است که مزایای آن در طولانی مدت به وضوح آشکار خواهد شد.