👨‍💼 Interview question / سوال مصاحبه

✅ خروجی تابع چیست؟

🔹 خروجی تابع مقدار undefined هست و دلیل آن نقطه ویرگول خودکاری هست که جاوااسکریپت آخر خط قرار میده.
🔹 بنابراین return بدون هیچ مقداری تفسیر میشود و مقدار undefined خروجی تابع است.

Automatic semicolon insertion in JavaScript


#interview_question

💡@frontcode01

مرسی که رعایت میکنید 😅❤️

🆔 @frontcode01 | 👩‍💻🧑‍💻

🚀 با Clipboard API جدیدی که برای کپی/پیست کردن تکست وجود داره، میتونید بدون اشغال کردن thread اصلی مرورگر عملیات کپی/پیست رو با جاواسکریپت انجام بدید!
این روش چون async هستش و thread اصلی رو اشغال نمیکنه، طبیعتا پرفورمنس بالاتری هم داره 👌🏻

🆔 @frontcode01 | 👩‍💻🧑‍💻

⚡️ با پلاگین draw.io برای VSCode میتونید یه اپ طراحی SVG رو مستقیم بیارید به ادیتور! تو خود VSCode ادیت کنید و بلافاصله هم استفاده کنید 😊

🔥 لینک پلاگین

🆔 @frontcode01 | 👩‍💻🧑‍💻

🔺 با کی‌ورد globalThis که به صورت دیفالت تو ES2020 اضافه شده،‌ میتونید بدون مشکلات زیادی که خود کی‌ورد this داره، به آبجکت گلوبال دسترسی داشته باشید.

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

🆔 @frontcode01 | 👩‍💻🧑‍💻

⚡️ موقع destructure کردن میتونید مقدار دیفالت وریبل رو از وریبل قبلیش بگیرید! تو این مثال، مقدار دیفالت nickname، همون مقدار name هستش

🆔 @frontcode01 | 👩‍💻🧑‍💻

🔺 یه راه جالب برای اینکه پاس دادن پارامتر فانکشنتون رو اجباری کنید. لطفا به تصویر توجه کنید:‌

اینجا یه فانکشن isRequired داریم که returnش مقدار دیفالت پارامتر num هستش، بنابراین اگه موقع کال کردن فانکشن print، پارامتر num رو پاس ندیم، مقدار دیفالت رو میگیره و چون isRequired داره ارور throw میکنه، عملا فانکشن print هم خط های بعدیشو ران نمیکنه و ارور رو نمایش میده.

🆔 @frontcode01 | 👩‍💻🧑‍💻

🚀 با پراپرتی backdrop-filter میتونید به هرچیزی که پشت یک المنت دیده میشه افکت بدید. مثلا افکت blur بدید

پ.ن: این افکت تو UIهای اپل خیلی استفاده میشه

🆔 @frontcode01 | 👩‍💻🧑‍💻

⚡️ یه کار جالب که میتونید با وریبل‌های "گلوبال" CSS انجام بدید اینه که مقدارشون رو "فقط برای یه کلاس خاص" override کنید

✅ تو این مثال در کلاس remove-shadow مقدار وریبل گلوبال component-shadow رو none میدیم تا هر المنتی که این کلاس رو داره shadowش حذف بشه در حالی که خود وریبل component-shadow بدون تغییر در جاهای دیگه کد قابل استفاده هستش!

🆔 @frontcode01 | 👩‍💻🧑‍💻

🔺 در حالت عادی حتی اگه مقدار z-index برای pseudo elements (همون after و before) رو کمتر از مقدار z-index برای parentشون بدید، بازم روی parent قرار میگیرن(شکل داخل کادر قرمز). برای اینکه pseudo المنت‌ها زیر parent قرار بگیرن "حتما" باید z-index منفی بهشون بدید!

🆔 @frontcode01 | 👩‍💻🧑‍💻

⚡️ با پلاگین typescript-expect-plugin میتونید تست‌های فانکشنتون رو مستقیم چند خط بالاتر از جایی که دارید فانکشن رو تعریف میکنید، بنویسید و نیازی به فایل جدای تست ندارید

پ.ن: برای کسایی که تازه دارن تست نوشتن رو شروع میکنن میتونه مناسب باشه ولی یکمی که scale بزرگتر بشه، اصلا پیشنهاد نمیشه 😁

#typescript
#ts

🆔 @frontcode01 | 👩‍💻🧑‍💻

⚡️ استایل های دیفالت جدید برای فرم‌ها در کروم ۸۳ و مقایسش با ورژن قبلی کروم رو میتونید در تصویر مشاهده کنید

#chrome

🆔 @frontcode01 | 👩‍💻🧑‍💻

وقتی تو بیمارستان داری میمیری و کارفرما میپرسه تغییرات چیشد

🆔 @frontcode01 | 👩‍💻🧑‍💻

مقدار X رو شما در کامنت ها حدس بزنید ❓
اگه دوست داشتین دلیلتون رو هم بنویسید ❤️

🆔 @frontcode01 | 👩‍💻🧑‍💻

🚀 با سلکتور not: میتونیم اون المنت های که فرزند برخی المنت های دیگر نیستند را تشخیص دهیم و استایل اعمال کنیم.

🆔 @frontcode01 | 👩‍💻🧑‍💻

🔺 با استفاده از شبه‌کلاس focus-within: میشه برای زمانی که خود اِلِمان یا نوادگانش در وضعیت focus قرار گرفته، استایل جداگانه‌ای تعریف کرد.
مثلا تاکید کردن رو فیلدی که کاربر پر می‌کنه، مرحله‌ای که در اون قرار داره یا هر استفاده‌ی دیگه‌ای که منجر به تجربه‌ی بهتر کاربر بشه!

🆔 @frontcode01 | 👩‍💻🧑‍💻