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

۱- Optional Chaining (?.)

اولین ویژگی کاربردی در جاوااسکریپت Optional Chaining است. اگر تا به حال برای بررسی مقادیر موجود در یک آبجکت تودرتو چندین عبارت if نوشته باشیم متوجه می‌شویم که Optional Chaining این فرآیند را ساده‌تر کرده و احتمال بروز خطاهای زمان اجرا، هنگام دسترسی به ویژگی‌های عمیق تودرتو را کاهش می‌دهد. به عنوان مثال:

const user = {
  name: 'John',
  address: {
    city: 'New York'
  }
};

// Without Optional Chaining
const city = user && user.address ? user.address.city : undefined;

// With Optional Chaining
const city = user?.address?.city;

console.log(city); // 'New York'

چرا باید از Optional Chaining استفاده کنیم؟

• با استفاده از Optional Chaining، دیگر نیازی به نوشتن شرط‌های متعدد برای بررسی مقادیر null یا undefined نداریم. این ویژگی به صورت خودکار بررسی می‌کند که آیا یک مقدار وجود دارد یا نه و اگر وجود نداشت، از بروز خطا جلوگیری می‌کند.
• با استفاده از این قابلیت، کد ما کوتاه‌تر، خواناتر و حرفه‌ای‌تر می‌شود. زیرا، به جای بررسی‌های تودرتو، تنها با یک علامت ?. می‌توانیم به صورت ایمن به داده‌ها دسترسی پیدا کنیم.

۲- عملگر Nullish Coalescing (??)

عملگر ?? یک جایگزین عالی برای || در ارائه مقادیر پیش‌فرض است. برخلاف || که هر مقدار false مانند false، ۰ یا '' (رشته خالی) را به عنوان مقدار nullish در نظر می‌گیرد، عملگر ?? تنها null و undefined را به عنوان nullish در نظر می‌گیرد. این ویژگی باعث می‌شود تا از اشتباهاتی که ممکن است در استفاده از || اتفاق بیفتد، جلوگیری کنیم. مثلا:

const input = 0;

// Using OR (||)
const value = input || 10; // 10 (undesirable)

// Using Nullish Coalescing (??)
const value = input ?? 10; // 0 (desirable)

console.log(value);

چرا باید از عملگر ?? استفاده کنیم؟

• با استفاده از ?? می‌توانیم از ارزیابی‌های ناخواسته جلوگیری کنیم. به عبارت دیگر، فقط زمانی مقدار پیش‌فرض اعمال می‌شود که مقدار مورد نظر دقیقاً null یا undefined باشد، و نه زمانی که مقدار ما به طور غیرمنتظره‌ای یکی از مقادیر false مانند false یا ۰ است.
• عملگر ?? این امکان را به ما می‌دهد تا مقادیر پیش‌فرض را به روشی شفاف و قابل پیش‌بینی مدیریت کنیم. همین موضوع باعث می‌شود کدی که داریم از نظر منطقی واضح‌تر باشد و خطاهای ناخواسته به حداقل برسد.

۳- Importهای داینامیک

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

if (user.isAdmin) {
  import('./adminPanel.js').then(module => {
    module.loadAdminPanel();
  });
}

چرا باید از Importهای داینامیک استفاده کنیم؟

• با استفاده از Importهای داینامیک می‌توانیم کدهایی را که فوراً به آن‌ها نیاز نداریم، بارگذاری نکنیم؛ که این موضوع باعث می‌شود تا زمان بارگذاری اولیه کاهش پیدا کند. به این ترتیب، کاربران می‌توانند سریع‌تر به ویژگی‌های اساسی دسترسی پیدا کنند، در حالی که بقیه کدها به تدریج بارگذاری می‌شوند.
• Importهای داینامیک برای پیاده‌سازی lazy loading در برنامه‌های وب مدرن ضروری هستند. Lazy loading یکی از تکنیک‌های مهم برای بهینه‌سازی وب‌سایت‌ها و اپلیکیشن‌ها است. با بارگذاری تدریجی بخش‌هایی از برنامه که فقط در صورت نیاز مورد استفاده قرار می‌گیرند، می‌توانیم عملکرد و تجربه کاربری بهتری را ارائه دهیم.

۴- Promise.allSettled

وقتی با چندین promise در جاوااسکریپت کار می‌کنیم، گاهی ممکن است بخواهیم نتیجه هر promise را، فارغ از موفقیت‌آمیز بودن یا نبودن آن بدانیم. در حالی که Promise.all با اولین reject شدن یکی از promiseها متوقف می‌شود (یعنی سریع شکست می‌خورد)، اما Promise.allSettled حتی اگر یکی از promiseها reject شود، همچنان منتظر تکمیل تمام promiseهای باقی‌مانده می‌ماند و سپس نتیجه کامل را به ما ارائه می‌دهد. به این ترتیب، می‌توانیم وضعیت هر promise (چه موفقیت‌آمیز و چه با خطا) را بررسی نماییم. به عنوان مثال:

const promises = [
  Promise.resolve('Success'),
  Promise.reject('Error'),
  Promise.resolve('Another success')
];

Promise.allSettled(promises).then(results => {
  results.forEach(result => {
    if (result.status === 'fulfilled') {
      console.log('Fulfilled:', result.value);
    } else {
      console.log('Rejected:', result.reason);
    }
  });
});

چرا باید از Promise.allSettled استفاده کنیم؟

• با استفاده از allSettled، حتی اگر یک یا چند promise رد شوند، اجرای بقیه promiseها ادامه داشته و نتیجه نهایی به‌طور کامل به ما ارائه می‌شود. این ویژگی باعث می‌شود که نتایج همه promiseها را بدون اینکه نیاز باشد فرآیند را با اولین خطا متوقف نماییم، مدیریت کنیم.
• استفاده از allSettled برای سناریوهایی که می‌خواهیم تمام نتایج را به طور جداگانه مدیریت کنیم، بسیار ایده‌آل می‌باشد.

عملگرهای تخصیص منطقی (&&=، ||=، ??=)

این عملگرهای کوتاه، عملیات منطقی و انتساب‌ها را ترکیب کرده و کد ما را مختصرتر می‌کنند. به عنوان مثال:

let user = {
  isLoggedIn: false,
  preferences: null
};

// Using Logical Assignment Operators
user.isLoggedIn ||= true; // Sets to true if false or undefined
user.preferences ??= { theme: 'dark' }; // Sets if null or undefined

console.log(user);
// { isLoggedIn: true, preferences: { theme: 'dark' } }

چرا باید از عملگرهای (&&=، ||=، ??=) استفاده کنیم؟

• استفاده از عملگرهای کوتاه باعث می‌شود که کد ما کم‌حجم‌تر و خواناتر شود. یعنی، به جای نوشتن چندین خط برای بررسی و انتساب مقدار، می‌توانیم به راحتی با استفاده از این عملگرها این عملیات را ترکیب نماییم. این کار کد ما را مختصرتر و منطقی‌تر می‌کند.
• در حالت‌هایی که state یا آبجکت‌ها را به‌روزرسانی می‌کنیم، این عملگرها می‌توانند خوانایی کد را افزایش دهند. به‌ویژه در برنامه‌های جاوااسکریپت که به طور مکرر نیاز به بروزرسانی state داریم، استفاده از این عملگرها می‌تواند به ما کمک کند تا کد خود را تمیزتر و مؤثرتر بنویسیم.

جمع‌بندی

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