ویژگی های جدید ES2019 که باید یاد داشته باشید

الان 2019 است و برخی ویژگی جدید در آخرین نسخه استاندارد 2019 جاوا اسکریپت یعنی ES10 وجود دارد.جاوا اسکریپت خیلی سال است که وجود دارد و در حال تبدیل شدین به محبوب ترین زبان برنامه نویسی در جهان است.در این پست قصد دارم برخی از ویژگی های باحال و ضروری که در استاندارد ES10/ES2019 وجود دارد،معرفی کنم.بیایید نگاهی به جدیدترین ویژگی هایی که کمیته TC39 امسال تصویب کرد،نگاهی بندازیم.

()Array.prototype.flat

prototypeجدید که به آرایه ها اضافه شده است،تایع ()flat است.این تابع یک آرایه جدید ایجاد می کند و عناصر آرایه را به ترتیب آرایه قدیمی قرار میدهد.به تیکه کد زیر نگاه کنید:

const users = [["Adam", 1"], ["Jones", "2"], ["John", "3"]];
const flatUsers = users.flat(); 
console.log(flatUsers);
// ["Adam", "1", "Jones", "2", "John", "3"];

const users = [["Adam", 1"], ["Jones", "2"], ["John", "3"]];

const flatUsers = users.flat();

console.log(flatUsers);

// ["Adam", "1", "Jones", "2", "John", "3"];

به صورت پیشفرض مقدار flattening 1 است.با پاس دادن پارامتر Infinity به درون ()flat آن به صورت بی نهایت بار به صورت بازگشتی اجرا می شود تا به یک آرایه تبدیل شود.این prototypeجدید یک ویژگی فوق العادس که به آرایه ها اضافه شده است.به جای جستجو به دنبال کتابخانه های جانبی، ما فقط کافیه که از ()flatاستفاده کنیم.

()Array.prototype.flatMap

این یک method دیگه است که در ES2019 می توانید استفاده کنید.این method ترکیب method های flat و map است.این method به شما اجازه می دهد تا عناصر آرایه را در یک آرایه جدید به هماره تغییرات map کنید.ترکیب این دو method میتواند خیلی مفید باشد.به تیکه کد زیر توجه کنید:

let myArray = [1,2,3,4]
myArray.flatMap(x => [x, x+2])
console.log(myArray)
//[1, 3, 2, 4, 3, 5, 4, 6]

let myArray = [1,2,3,4]

myArray.flatMap(x => [x, x+2])

console.log(myArray)

//[1, 3, 2, 4, 3, 5, 4, 6]

()String.prototype.trimStart یا ()trimEnd

تا قبل از ES2019 ما تابع ()trim رو داشتیم.این فضاهای خالی را در یک string بر می دارد.با اضافه شدن توابع ()trimStart و ()trimEnd در ES10 شما می توانید انتخاب کنید که کدام قسمت از string نیاز دارد trimmed شود.این یک ویژگی خیلی باحال است که به string ها اضافه شده است.

const mySample = "     Hey There    ";
console.log(mySample.trimStart());
// "Hey There    ";
console.log(mySample.trimEnd());
// "     Hey There";

const mySample = " Hey There ";

console.log(mySample.trimStart());

// "Hey There ";

console.log(mySample.trimEnd());

// " Hey There";

()Object.fromEntries

()fromEntries یک لیست از key-value های جفت شده را به یک object انتقال می دهد.تابع () Object.entriesدر حال حاضر object را تبدیل به key-value های جفت شده می کند.()Object.fromEntries دقیقا معکوس اینکار را انجام می دهد.به تیکه کد زیر با مثال user-id توجه کنید.

const user = [
  ["1", "Adam"],
  ["2", "Jones"],
  ["3", "John"],
  ["4", "Smith"]
];

const userObject = Object.fromEntries(user);

console.log(userObject);
// {
//   "1": "Adam",
//   "2": "Jones",
//   "3": "John",
//   "4": "Smith"
// };

const user = [

["1", "Adam"],

["2", "Jones"],

["3", "John"],

["4", "Smith"]

];

const userObject = Object.fromEntries(user);

console.log(userObject);

// {

// "1": "Adam",

// "2": "Jones",

// "3": "John",

// "4": "Smith"

// };

Catch Error Binding is Optional

من شخصا این ویژگی را دوست دارم.اما این یک بحث جنجالی است زیرا بسیاری از توسعه دهندگان فکر نمی کنند این یک ایده خوب است.با این وجود catch error binding در ES2019 اختیاری است.

معرفی کتابخانه Persian Tools

قبل از ES2019 پارامتر error در catch اجباری بود

try {
  throw "Some error";
} catch (error) {
  // Error handling logic
}

try {

throw "Some error";

} catch (error) {

// Error handling logic

}

در ES2019 شما می توانید پارامتر error رو اگر بهش نیاز ندارید،حذف کنید

try {
  throw "Some error";
} catch {
  // Some handling logic
}

try {

throw "Some error";

} catch {

// Some handling logic

}

()Stable Array.prototype.sort

پیاده سازی قبلی sort() method برای prototype آرایه ها از الگوریتم سریع sort استفاده می کرد که یک راه حل unstable بود.

با ES2019 یک الگوریتم stable sorting پیاده سازی شده است.

let users = [
    { name: "Adam",   rank: 4, },
    { name: "Jones",  rank: 3, },
    { name: "Katie",  rank: 3, },
    { name: "Smith",  rank: 2, },
    { name: "Ben",    rank: 2, },
    { name: "Julie",  rank: 1, },
    { name: "Tyler",  rank: 1, }
];

let my_sort = (a, b) => a.rank - b.rank;
// Perform stable ES2019 sort:
let sorted = users.sort(my_sort);
console.log(sorted);
//[
//	{ name: "Adam",   rank: 4 },
//	{ name: "Jones",  rank: 3 },
//	{ name: "Katie",  rank: 3 },
//	{ name: "Ben",    rank: 2 },
//	{ name: "Smith",  rank: 2 },
//	{ name: "Julie",  rank: 1 },
//	{ name: "Tyler",  rank: 1 }
//]

let users = [

{ name: "Adam", rank: 4, },

{ name: "Jones", rank: 3, },

{ name: "Katie", rank: 3, },

{ name: "Smith", rank: 2, },

{ name: "Ben", rank: 2, },

{ name: "Julie", rank: 1, },

{ name: "Tyler", rank: 1, }

];

let my_sort = (a, b) => a.rank - b.rank;

// Perform stable ES2019 sort:

let sorted = users.sort(my_sort);

console.log(sorted);

//[

// { name: "Adam", rank: 4 },

// { name: "Jones", rank: 3 },

// { name: "Katie", rank: 3 },

// { name: "Ben", rank: 2 },

// { name: "Smith", rank: 2 },

// { name: "Julie", rank: 1 },

// { name: "Tyler", rank: 1 }

//]

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

اگر شما در جاوا اسکریپت مبتدی هستید، من به شما پیشنهاد میکنم دوره جاوا اسکریپت رو دنبال کنید.

منبع : بلاگ مشفق همدانی