در سال 2019، چه چیزی در JavaScript جدید است؟

در چند سال اخیر، JavaScript در حال تکامل بر روی روالی ثابت با ویژگی‌های زبانی جدید بوده است. اگر کنجکاوید که نسخه بعدی JavaScript چه چیزی را به همراه دارد، این پست برای شماست!

قبل از این که درباره آخرین امکانات صحبت کنیم، مهم است که نحوه تبدیل شدن ایده‌های جدید به بخشی از زبان JavaScipt را درک کنیم.

فرایند امکانات جدید زبان JavaScript

لپ کلام این که مشخصه زبانی که JavaScript را می‌راند، ECMAScript نام دارد. گروه بین المللی ECMA که تغییرات مشخصه این زبان را در کمیته فنی ۳۹ (Technical Committee 30) یا TC39 بررسی کرده، و تصویب می‌کند. تغییرات موجود در مشخصه ECMAScript از یک فرایند استانداردسازی شده، که شامل سکوهای بلوغ می‌باشد می‌گذرند.

• سکوی ۰: ایده‌ها
• سکوی ۱: پیشنهادات رسمی
• سکوی ۲: پیش‌نویس‌ها
• سکوی ۳: نامزدها
• سکوی ۴: تایید شده

تا زمانی که یک ویژگی به سکوی ۴ برسد، هیچ تضمینی وجود ندارد که بخشی از مشخصه زبان ECMAScript رسمی شود. گرچه، پیاده‌سازی‌های موتور JavaScript مانند V8 (که مورد استفاده Chrome و Node.js قرار دارد) و SpikerMonkey فایرفاکس، شاید برای ویژگی‌های پیشنهاد داده شده قبل از رسیدن به سکوی ۴، پشتیبانی آزمایشی اضافه کنند تا توسعه دهندگان بتوانند آن را آزمایش کرده، و بازخوردهایی را تحویل دهند.

نامزدهای فعلی ES2019

در زمان نوشتن این مقاله، هیچ‌گونه پیشنهاد TC39 که در سکوی ۴ باشد وجود ندارد. گرچه، چند نامزد در سکوی ۳ وجود دارند.

نکته: با توجه به این که این موارد نامزدهای سکوی ۳ هستند، مشخصه زبان ES2019 نهایی شاید شامل تمام این پیشنهادات نباشد. در واقع، برخی از این پیشنهادات برای چند سال تحت نظر بوده‌اند. همچنین، وقتی که پیاده‌سازی نهایی منتشر شود، شاید ظاهر و حس متفاوتی نسبت به نامزدهای فعلی داشته باشد.

تغییرات کلاس‌های JavaScript

چند تغییر پیشنهادی مانند تعریفات فیلد، متدها و فیلدهای خصوصی، و متدها و فیلدهای استاتیک به کلاس‌ها اعمال شده‌اند. در اینجا مثالی از ظاهر احتمالی این تغییرات را مشاهده می‌نمایید:

class Truck extends Automobile {
  model = "Heavy Duty"; // public field declaration
  #numberOfSeats = 5; // private field declaration
  #isCrewCab = true;
  static #name = "Truck"; // static private field declaration

  // static method
  static formattedName() {
    // Notice that the Truck class name is used
    // to access the static field instead of "this"
    return `This vehicle is a ${ Truck.#name }.`;
  }

  constructor( model, seats = 2 ) {
    super();
    this.seats = seats;
  }

  // Private method
  #getBodyType() {
    return this.#isCrewCab ? "Crew Cab" : "Standard Cab";
  }

  bodyType() {
    return `${ this.#numberOfSeats }-passenger ${ this.model } ${ this.#getBodyType() }`;
  }

  get seats() { return this.#numberOfSeats; }
  set seats( value ) {
    if ( value >= 1 && value < 7 ) {
      this.#numberOfSeats = value;
      this.#isCrewCab = value > 3;
    }
  }
}

من به شخصه ظاهر آن سینتکس # را برای اعضای خصوصی دوست ندارم. من ترجیح می‌دهم ببینم که مشخصه زبان JavaScript، کلید واژه private را برای این هدف به کار بگیرد؛ درست به مانند زبان‌های دیگر.

trimStart() و trimEnd() رشته‌ها

نوع داده string، یک متد به نام trim() دارد که فضاهای خالی را هم از ابتدا، و هم از انتهای یک رشته حذف می‌کند. متدهای پیشنهادی trimStart() و trimEnd() کنترل سنتی را بر روی حذف فضاهای خالی ممکن خواهند ساخت.

const one = "      hello and let ";
const two = "us begin.        ";
console.log( one.trimStart() + two.trimEnd() ) // "hello and let us begin."

نکات ریز و جالب درباره این ویژگی، این است که همین حالا هم در تعدادی از موتورهای JavaScript پیاده‌سازی شده‌اند. این یکی از چند مواردی است که مرورگرها در آن به پیشروی این زبان کمک می‌کنند.

اعداد بزرگ‌تر با BigInt

شاید ما ظهور BigInt را برای اعدادی که از مقدار حد اکثری فعلی، یعنی ۲۵۳ هستند ببینیم. یک BinInt، می‌تواند به چند روش مختلف تعریف شود.

// for reference
const theBiggestIntegerToday = Number.MAX_SAFE_INTEGER; // 9007199254740991

// use the 'n' syntax to declare a BigInt
const ABiggerInteger = 9100000000000001n;

// use the BigInt() constructor
const EvenBigger = BigInt( 9100000000000002 ); // 9100000000000002n

// use the BigInt() constructor with a string
const SuchBigWow = BigInt( "9100000000000003" ); // 9100000000000003n

آرایه‌ها را با استفاده از flat() و flatMap() مسطح کنید

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

const nestedArraysOhMy = [ "a", ["b", "c"], ["d", ["e", "f"]]];
// .flat() takes an optional depth argument
const ahhThatsBetter = nestedArraysOhMy.flat( 2 );
console.log( ahhThatsBetter ); // [ "a", "b", "c", "d", "e", "f" ]

flatMap() مشابه map() می‌باشد، اما callback مربوطه می‌تواند یک آرایه را برگرداند، و نتایج نهایی به جای آرایه‌های تو در تو، آرایه‌های تک بعدی و مسطح خواهند بود.

const scattered = [ "my favorite", "hamburger", "is a", "chicken sandwich" ];

// regular map() results in nested arrays
const huh = scattered.map( chunk => chunk.split( " " ) );
console.log( huh ); // [ [ "my", "favorite" ], [ "hamburger" ], [ "is", "a" ], [ "chicken", "sandwich" ] ]

// flatMap() concatenates the returned arrays together
const better = scattered.flatMap( chunk => chunk.split( " " ) );
console.log( better ); // [ "my", "favorite", "hamburger", "is", "a", "chicken", "sandwich" ]

نامزدهای مطرح ES2019

در اینجا لیست نامزدهای دیگر سکوی ۳ را مشاهده می‌نمایید:

• آبجکت globalThis استانداردسازی شده
• import() دینامیک
• ویژگی‌های Legacy RegExp
• import.meta
• matchAll() در رشته‌ها
• object.fromEntries()
• JSON.stringify با شکل بهتر
• Hashbag استانداردسازی شده برای برنامه‌های رابط خط دستوری (CLI)

چه زمانی انتظار ES2019 را داشته باشیم؟

در سال‌های اخیر، TC39 به طور مداوم ویرایش‌های ECMA-262 مشخصه زبان ECMAScript را در ماه ژوئن منتشر کرده است. احتمال این که انتشار ES2019 را در این ماه ببینیم، بسیار بالاست.

امکانات ES2019 را امروز امتحان کنید

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

با آخرین نسخه Node.js آزمایش کنید

Node.js از موتور جاوااسکریپت Chrome V8 استفاده می‌کند. برخی از نامزدهای این زبان می‌توانند در آخرین نسخه Node.js به کار برده شوند؛ زیرا V8 همین الان هم آن‌ها را پشتیبانی می‌کند. (برای مثال Array.prototype.flat و String.prototype.trimEnd)

شما می‌توانید ویژگی‌های دیگر این زبان را با استفاده از گزینه‌های خط دستوری --harmony-{feature-flag} فعال کنید. برای دیدن این که نسخه Node.js شما چه flagهایی را پشتیبانی می‌کند، از گزینه --v8-options استفاده کنید. برخی نامزدها تحت عنوان «in progress» نشانه‌گذاری شده‌اند.

macOS / Linux

node --v8-options | grep "in progress"

Windows

node --v8-options | find "in progress"

برای مثال، برای اجرای یک برنامه Node.js که شامل کلاسی می‌باشد که از تعریفات فیلد و متدهای استاتیک استفاده می‌کند، می‌توانید از این گزینه CLI استفاده کنید:

node --harmony-class-fields --harmony-static-fields index.js

با Babel 7.0+ آزمایش کنید

Babel یک ابزار JavaScript است که شما را قادر می‌سازد تا از آخرین ویژگی‌های این زبان استفاده کنید، که شاید هنوز در تمام مرورگرها و محیط‌ها پشتیبانی نشوند. همینطور که شما یک کد JavaScript مدرن را می‌نویسید، Babel کد شما را به سینتکس معادل آن با موتورهای قدیمی‌تر تبدیل می‌کنند.

Babel ویژگی‌های آزمایشی این زبان را با استفاده از پلاگین‌ها پشتیبانی می‌کند. Babel لیستی از پیشنهادات ECMAScript پشتیبانی شده را در مخزن رسمی خود نگهداری می‌کند.

بیشتر درباره JavaScript یاد بگیرید

آیا می‌خواهید بیشتر به زبان JavaScript مسلط شوید؟ نگاهی به دوره مربوطه بر روی راکت، و همچنین این مقالات داشته باشید:

• ۱۲ سوال متداول جاوااسکریپت و جواب‌هایشان
• ۱۵ کتابخانه جالب JavaScript و CSS
• چگونه فایل‌های جاوااسکریپتی را ساختاربندی کنیم؟

منبع