Front-End جاوااسکریپت

اکمااسکریپت ۲۰۲۲ و ۴ ویژگی مهم که باید در مورد آن بدانیم

0
Please log in or register to do it.

اکمااسکریپت ۲۰۲۲ مهم ترین و برترین رویداد و استاندارد بعدی است که برای جاوااسکریپت انتظار داریم اتفاق بیوفته که قرار است در ژوئن ۲۰۲۲ (حدودا ۱۱ خرداد ۱۴۰۱ تا ۰۹ تیر ۱۴۰۱) برگزار و منتشر بشه. و قصد داریم توی این مقاله به ویژگی هایی که مطمعن هستیم در نسخه جدید جاوااسکریپت اون هارو مشاهده میکنیم، بپردازیم و ی مانوری روشون بدیم

ی نکته ای که باید همین اول بگم، اینه که شاید پیش خودتون بگین الان من از کجا میدونم که این ویژگی ها هستن توی es2022 که من در جواب باید بهتون بگم که این ویژگی ها توی مرحله چهارم TC39 هستن.

خب همونطور که گفتم این ویژگی ها توی مرحله چهارم TC39 هستن و شاید پیش خودتون بگین TC39 چیه دیگه؟ جدای از اون مرحله چهارمش چیه؟خب عجله نکنید الان توضیح میدم.

TC39 چیست؟

TC39 یک گروه از نگهدارنده های جاوااسکریپت هستم که حواسشون هست که این فرزند گران بها درست تربیت بشه و درست رشد کنه. خو بسه دیگه مسخره بازی?

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

اگر میخواین اطلاعات بیشتری راجب این گروه بدست بیارین به این لینک مراجعه کنید. گروه TC39

خب حالا فهمیدیم که TC39 چیه، پس بریم سراغ ویژگی ها. همینطور که گفتم این ویژگی هایی که قراره باهم بررسی کنیم توی مرحله ۴ هستند یعنی اینکه تایید شدن و منتظر برگذاری رویداد هستن تا معرفی رسمی بشن و از اونجاس که مرورگر ها عزا میگیرن که باید دوباره این هارو به مرورگر هاشون اضافه کنند.?

۱. متد at() برای آرایه ها:

خب بلاخره در اکمااسکریپت ۲۰۲۲ ما این قابلیت رو خواهیم داشت تا اشیاء آرایه مانند را از انتها ایندکس کنیم. درسته که این ی ویژگی کوچیکه اما کارایی هسته رو در کار با آرایه ها و رشته ها افزایش میده و جدایی از اون اینکه دیگه جاوااسکریپت به سطحی رسیده که نباید انتظار ویژگی هایی بزرگی رو داشته باشیم چون همه نیاز هامون رو برطرف کرده و الان دیگه با این ویژگی های کوچیک داره کارهامون رو آسون تر میکنه. برگردیم سر متد خودمون.

متد at() با اعداد مثبت همونطوری عادی رفتار میکنه و از ابتدای آرایه مقدار رو برمیگردونه ولی با اعداد منفی از آخر آرایه شروع به محاسبه میکنه.

قبلا چی می نوشتیم:

const arr = [1,2,3,4]
arr[arr.length - 2] // 3
arr.slice(-2)[0]    // 3

const str = "1234"
str[str.length - 2] // '3'
str.slice(-2)[0]    // '3'

با متد at() میتونیم اینطوری بنویسیم:

const arr = [1,2,3,4]
arr.at(-2) // 3

const str = "1234"
str.at(-2) // '3'

۲. خطا cause :

خب ی ویژگی جدید به خطا ها اضافه شده که ما میتونیم به استفاده از cause مشخص کنیم که خطای رخ داده مربوط به کدام خطاس. متوجه شدین؟بعید میدونم?

خب یکم واضح تر. ببینید فرض کنید شما از پرامیس ها یا try catch استفاده میکنید که ممکنه چندین خطا رخ بده. حالا شما میتونید با استفاده از متد cause بفهمید خطا مربوط به کجا بوده. حالا ی مثال هم میزنم که ببینید چطوری باید استفاده کنید. البته چون هنوز منتشر نشده نمیتونیم نتیجه رو ببینیم و فقط میدونیم ی همچین روشی داره.

try {
  doSomeComputationThatThrowAnError() 
} catch (error) {
  throw new Error('I am the result of another error', { cause: error })
}

که میتونید با استفاده از این امکان زنجیره ای از خطا هارو مدیریت کنید که به طور مثال این کار توی زبان جاوا به خوبی قابل پیاده سازیه.

راستش من تا همین حد تونستم اطلاعات کسب کنم راجب این موضوع. اگر شما هم چیز جدیدی راجبش پیدا کردین توی دیدگاه ها ارسال کنید تا همه یاد بگیریم.?

۳. Top-level await

ی چیزی که من خیلی از دیدنش خوشحال شدم این ویژگی top-level await بود. فک کنم که همه بدونید ما نمیتونیم await رو خارج از تابع استفاده کنیم ولی چون من آقای مبتدی هستم پس نمیدونم و کاملا مبتدی ام. پس این نکته رو باید بدونم که await رو نمیتونم خارج از تابع استفاده کنم، اما ی لحظه صبر کنید. اگر اکمااسکریپت ۲۰۲۲ منتشر بشه دیگه میشه.

بله درست شنیدین، با این ویژگی جدید شما میتونید await رو خارج از تابع استفاده کنید.

شاید براتون سوال باشه خب به چه دردی میخوره؟

اول اینکه میتونید ماژول هارو پویا بارگذاری کنید:

const serviceName = await fetch("https://example.com/what-service-should-i-use")
const service = await import(`/services/${serviceName}.js`)

// OR

const params = new URLSearchParams(location.search);
const theme = params.get('theme');
const stylingFunctions = await import(`/styling-functions-${theme}.js`);

دوم اجازه میده ماژول هارو با شرط ها ارائه کنید:

const date = new Date()

if(date.getFullYear() === 2023) {
  await require('/special-code-for-2023-year.js')
}

سوم؟ شما برامون کامنت کنید..?

من مطمئنم که خیلی حرکت های خفن تری میشه به این قابلیت زد پس اگر شما هم چیزی به نظرتون رسید توی دیدگاه ها ثبتش کن تا همه ازش استفاده کنیم.

۴. اسلات ها و متد های خصوصی – Private slots and methods

کلاس ها در جاوا اسکریپت خالص از زمان ES6 وجود دارند، اما نسبت به زبان های شی گرا بسیار کمتر توسعه یافته اند. بسیاری از توسعه دهندها از Typescript برای گنجاندن برخی از این ویژگی ها استفاده می کنند و از الان به بعد می تونیم شاهد پیاده سازی آن در کلاس های JS خالص باشیم.easyyy

اسلات های خصوصی هم یکی از اون هاست. آونا چیزی بیشتر از خصوصیات خصوصی نیستن. ES2022 به ما این امکان را میده که اون ها رو ایجاد کنیم و هنگامی که سعی می کنیم خارج از کلاس به آنها دسترسی پیدا کنیم با خطا مواجه شویم. متد های خصوصی هم همینطور. جالب توجه که تیم JS انتخاب کرد که به آنها پیشوند # بدن.

یک نمونه از اسلات ها (خصوصیات خصوصی):

class Human {
  #name = "John";
  
  setName(name) {
    this.#name = name;
  }
}

const human = new Human()
human.#name = 'Amy'  // ERROR!
human.setName('Amy') // OK

و متد خصوصی:

class Human {
  name = "John";
  
  constructor(name) {
    this.#setName('Amy') // OK
  }
  
  #setName(name) {
    this.name = name;
  }
}

const human = new Human()
human.#setName('Amy') // ERROR!

کلام آخر

این لیست هنوز کامل نیست و ممکنه تا زمان برگزاری رویداد و انتشار رسمی، ویژگی های جدیدتری اضافه بشه اما به نظر من اینا تاثیرگذارترین و مفیدترین ویژگی های نسخه جدید هستن. شما می توانید تمام پیشرفت ها رو در اینجا پیدا کنید. و به من بگید نظر شما در مورد ویژگی های جدید چیه و آیا قصد استفاده از آون ها رو دارید؟

منبع: medium

9 تابع جاوااسکریپت که توی هر پروژه ای لازمه
اکمااسکریپت 2021 و ویژگی های جدید JS

منتخب سردبیر

اولین مطلب منتشر شده به زبان فارسی برای اکمااسکریپت 2022

Reactions

3
1

فعلا کسی لایک نکرده

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *