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

۶۱. المنت Template توی HTML برای چه کاری هست؟
۶۲. منظور از HOF توی جاوااسکریپت چیه و چه مزایایی داره؟
۶۳. URL و URI چه فرقی با هم دارن؟
۶۴. توی CSS چه زمانی Grid رو به Flexbox ترجیح بدیم؟
۶۵. از TDZ توی جاوااسکریپت چی می‌دونید؟
۶۶. چرا پیشنهاد میشه از حلقهٔ for...in جاوااسکریپت استفاده نکنیم؟
۶۷. چه زمانی از تگ section توی HTML استفاده نکنیم؟
۶۸. از Web Components چی می‌دونید؟
۶۹. توی CSS منظور از Specificity چیه و چه قوانینی داره؟
۷۰. چه زمانی از اتریبیوت‌های defer و async روی تگ script استفاده کنیم؟
 

مثل قسمت‌های قبل، می‌خوایم یادی کنیم از عزیز. امیدوارم روحش شاد و در آرامش باشه ✨💚

 

۶۱. المنت Template توی HTML برای چه کاری هست؟

<template> یک المنت خاص توی HTML برای نگهداری محتوایی هست که در حالت عادی و خودکار توسط مرورگر در زمان لود شدن صفحه رندر نمیشه و می‌تونه بعداً توسط جاوااسکریپت استفاده و رندر بشه. به بیان ساده‌تر، <template> مثل یک محفظه برای نگهداری یک محتوای HTML ـی هست که بعداً می‌تونه به صورت داینامیک توسط جاوااسکریپت به صفحه اضافه بشه:

<body>

  <template id="list-item-template">
    <li>
      <h2 class="title"></h2>
      <p class="description"></p>
    </li>
  </template>

  <ul></ul>

  <script>
    const template = document.querySelector('#list-item-template');
    const list = document.querySelector('ul');

    const item = template.content.cloneNode(true);
    item.querySelector('.title').innerText = "Hello world";

    list.appendChild(item);
  </script>
</body>

 

 

۶۲. منظور از HOF توی جاوااسکریپت چیه و چه مزایایی داره؟

HOF مخفف Higher-Order Function هست و به تابعی گفته میشه که می‌تونه یک تابع دیگه رو به عنوان ورودی بپذیره یا یک تابع رو به عنوان خروجی return کنه. در واقع HOF یک قابلیت مهم توی برنامه‌نویسی فانکشنال به حساب میاد. این قابلیت اجازه میده که با توابع مثل بقیه نوع‌های داده‌ای مثل رشته و آبجکت به عنوان First-class citizens رفتار کنیم و بتونیم اونها رو به متغیرها نسبت بدیم و یا به عنوان ورودی/خروجی توابع از اونها استفاده کنیم: