tgoop.com/fullStackDevs/520
Last Update:
#ES11
#NewFeatures
#java_script
❇️ New features in ES2020(ES 11)
🔸 در این پست به معرفی ویژگی های جدیدی که تحت عنوان ES2020 به جاوا اسکریپت اضافه شده است، می پردازیم.
باید بدانید که ES مخفف ECMAScript میباشد و استانداردی است که جاوا اسکریپت بر اساس ان ساخته شده است و شروع آن از سال 2015 بوده و گروهی از توسعه دهندگان جاوا اسکریپت و سایر افراد دیگر که در توسعه و افزودن ویژگی های جدید به جاوا اسکریپت همکاری میکنند.
در ECMAScript برای انتشار یک ویژگی جدید چهار مرحله وجود دارد :
▪️Proposal
▪️Draft
▪️Candidate
▪️Finished
🔸 زمانی که ویژگی جدید به مرحله چهارم برسد به عنوان یک بخشی از ECMAScript release تلقی میشود و از این به بعد این وظیفه ی مرورگر است که آن ویژگی را پیاده سازی کند.
🔹 پس قبل از اینکه از ویژگی جدیدی استفاده کنید مطمئن شوید که مرورگرتان آنرا پیاده سازی کرده باشد. برای این منظور میتوانید از
وب سایت caniuse کمک بگیرید.
🔶در ادامه به مهمترین ویژگی های ES11 میپردازیم
✳️ Nullish Coalescing Operator (??)
🔸زمانی که می خواهیم به یک پراپرتی یک آبجکت دسترسی داشته باشیم گاهی اوقات لازم است تا فقط درصورت null یا undefined بودن مقدار یک متغییر یا پراپرتی، مقادیر پیشفرض جایگزین شوند.
در گذشته برای این منظور از عملگر || استفاده میکردیم، اتفاقی که در حقیقت در زمان استفاده از این عملگر می افتاد این بود که مقادیر متغیر یا پراپرتی مربوطه توسط جاوااسکریپت به اجبار به Boolean تبدیل میشدند و در صورت که مقدار متغیر یا پراپرتی تعیین شده falsy بود مقدار پیشرفرض مشخص شده در نظر گرفته میشد.
مقادیر falsyType در جاوااسکریپت عبارتند از :
(رشته خالی) '' , 0,undefined,null,false,NaN , ...
const falsyTypes = {
emptyString: '',
zeroNum: 0,
falseBoolean: false,
nullValue: null,
}
const undefinedValue = falsyTypes.undefinedValue || 'my default'
🔸حال بیاییم شرایطی را در نظر بگیریم که فقط در صورت null یا undefined بودن مقدار یک پراپرتی, مقدار پیشفرض مشخص شده, در نظر گرفته شود.چنین شرایطی زمانی که از نوع داده ای متغیر خود آگاه نباشیم, اگر از عملگر || استفاده کنیم باعث بروز رفتار های ناخوسته ای میشود, به عنوان مثال ممکن است مقدار پراپرتی false باشد و بدلیل اینکه hcعملگر || استفاده کردیم, جاوااسکریپت از falsy check برای این منظور استفاده میکند, و باز هم مقدار پیشفرض درنظر گرفته خواهد شد.
در حالی که فقط میخواستیم اگر مقدار پراپرتی null یا undefined باشد, مقدار پیشفرض در نظر گرفته شود.
🔹حل این مشکل در ES11 با عملگر (??) انجام میشود.
در صورتی که مقدار متغیر فقط null یا undefined باشد, مقادیر پیشفرض در نظر گرفته خواهد شد.
✳️ Optional Chaining Operator(Elvis operator)
🔸این عملگر این امکان را فراهم میسازد که زمانی که در حال خواندن پراپرتی های یک آبجکت تو در تو هستید نگرانی ای در مورد وجود داشتن یا نداشتن پراپرتی های آن آبجکت نداشته باشید, اگر آبجکت مربوطه دارای پراپرتی مشخص شده نباشد undefined بازگشت داده خواهد شد.
🔹از این عملگر هم برای مطمئن شدن از وجود داشتن پراپرتی ها و متد ها در آبجت میتوانید استفاده کنید.
در گذشته برای این منظور بدین شکل عمل میکردیم :
const nestedObject = {
firstProp: {
secondProp: {
thirdProp: {
nestedProp: 3
}
}
}
};
if (nestedObject &&
nestedObject.firstProp &&
nestedObject.firstProp.secondProp && nestedObject.firstProp.secondProp.thirdProp && nestedObject.firstProp.secondProp.thirdProp.nestedProp) {
const validPropriety = nestedObject.firstProp.secondProp.thirdProp.nestedProp
console.log(validPropriety) // 3
}
🔹و اما راه حل ES11 آن بدین شکل است :
const checkedProp = nestedObject?.firstProp?.secondProp?.thirdProp?.nestedProp
console.log(checkedProp)
✳️ Promise.allSettled
🔸 این متد که در ES11 اضافه شده، آرایه ای از promise ها دریافت میکند، زمانی که از این متد استفاده میکنید، این متد به عنوان خروجی یک promise باز میگرداند، که شامل ارایه ای از promise های داده شده به آن است و وضعیت reject یا resolve شدن هر یک از promise های داده شده در آن مشخص میباشد، در واقع زمانی که از این متد استفاده میکنید،حتما resolve شدن همه ی promise ها اهمیتی ندارد.
@FullStackDevs
BY Web Devs
Share with your friend now:
tgoop.com/fullStackDevs/520