https://www.angularspace.com/senior-angular-interview-questions/

یکی از بیشترین unique view های مقاله سایت angular space همین پست سوالات مصاحبه ای انگولار هست

خیلی بدرد شرکت های خیلی بزرگ میخوره که چه داخل چه خارج استفاده کنیم که بهترین خودمون رو ارائه بدیم

#angularinterview
#angular
@angularcafe

از امروز یه سری سوال و جواب‌های استاندارد و کوتاه مصاحبه انگولار رو هر روز میذارم تو کانال و امروز اولین روز شو میذارم 🤩

#angularinterview
@angularcafe

#Angularinterview:

سوال و جواب مصاحبه ای Angular - روز اول (مبانی Angular)

🔹 موضوع روز ۱: اصول Angular که هر مصاحبه‌کننده‌ای انتظار داره بلد باشی

1️⃣ سوال: Angular چیه؟
پاسخ: Angular یک framework فرانت‌اند بر پایه TypeScript هست که توسط Google توسعه داده شده و برای ساخت اپلیکیشن‌های مقیاس‌پذیر تک‌صفحه‌ای (SPA) با معماری component-based استفاده می‌شه.

2️⃣ سوال: اجزای اصلی و پایه‌ای Angular چی‌ها هستن؟
پاسخ:
• مفهوم: Modules — برای سازمان‌دهی featureهای اپلیکیشن
• مفهوم: Components — کنترل Viewها و منطق UI
• مفهوم: Templates — کد HTML همراه با syntax مخصوص Angular
• مفهوم: Services — منطق business قابل استفاده مجدد
• مفهوم: Dependency Injection (DI) — تزریق و فراهم‌کردن dependencyها به شکل بهینه

3️⃣ سوال: Component چیه؟
پاسخ: Component اصلی‌ترین واحد سازنده UI در Angular هست.
هر Component از این بخش‌ها تشکیل می‌شه:
• HTML template
• TypeScript class
• CSS styles

و هر Component یک بخش مشخص از UI رو کنترل می‌کنه.

4️⃣ سوال: Data Binding در Angular یعنی چی؟
پاسخ: Data Binding یعنی همگام‌سازی داده بین class مربوط به Component و template.

انواعش:
• Interpolation {{ }}
• Property binding [ ]
• Event binding ( )
• Two-way binding [(ngModel)]

5️⃣ سوال: چرا Angular برای پروژه‌های بزرگ مناسبه؟
پاسخ:
• ساختار و conventionهای قوی
• DI داخلی و RxJS
• CLI قدرتمند
• مقیاس‌پذیری و نگهداری راحت‌تر

📌 نکته: با دونستن این مبانی کمک می‌کنه توی مصاحبه‌های Angular یک برداشت اولیه قوی و حرفه‌ای از خودت بسازی.

➡️ ادامه: روز ۲ به‌زودی… (Angular Lifecycle Hooks)

#angularinterview
@angularcafe

#Angularinterview

سوال و جواب مصاحبه‌‌ای Angular - روز دوم (Angular Lifecycle Hooks)

ادامه‌ی سری روزانه مصاحبه Angular؛ این بار می‌ریم سراغ موضوعی که تقریباً توی بیشتر مصاحبه‌ها حتماً بهش گیر می‌دن.

🔹 موضوع روز ۲: Angular Lifecycle Hooks

1️⃣ سوال: Angular lifecycle hooks چی هستن؟
پاسخ: Lifecycle hooks یک سری method هستن که بهت اجازه می‌دن به فازهای مختلف زندگی یک component دسترسی داشته باشی - از لحظه‌ی ساخته شدن تا زمان destroy شدن.

2️⃣ سوال: پرکاربردترین lifecycle hookها کدوما هستن؟
پاسخ:
• متد ngOnInit()
بعد از اینکه component ساخته و initialize شد، فقط یک بار اجرا می‌شه.
⚡️ بهترین جا برای API callها و تنظیمات اولیه.

• متد ngOnChanges()
وقتی مقدار input تغییر کنه اجرا می‌شه.
⚡️ زمانی استفاده می‌شه که component باید به تغییرات داده‌ی parent واکنش نشون بده.

• متد ngAfterViewInit()
بعد از اینکه view مربوط به component کامل initialize شد اجرا می‌شه.
⚡️ برای دسترسی به DOM و منطق viewChild خیلی کاربردیه.

• متد ngOnDestroy()
قبل از اینکه component از بین بره اجرا می‌شه.
⚡️ برای cleanup کردن subscriptionها، timerها و event listenerها و کلا پاک سازی حافظه استفاده شده است که بسیار مهمه که رعایت بشه برای بهبود performance سیستم.

در Angular در واقع Hook های بیشتری از موارد یاد شده وجود داره که دوست داشتید میتونیم اونا رو هم مطرح و بررسی کنیم، موارد گفته شده پر‌کاربرد‌ترین‌ها بودن.

3️⃣ سوال: فرق constructor با ngOnInit() چیه؟
پاسخ:
• constructor: بیشتر برای dependency injection استفاده می‌شه که دیگه بهتره به جای استفاده از constructor از inject function بهتره استفاده بشه.
• ngOnInit() : برای منطق initialize شدن component

4️⃣ سوال: چرا ngOnDestroy() مهمه؟
پاسخ: اگر subscriptionها و timer‌ها و listener‌ها رو cleanup نکنی، سیستم دچار memory leak میشه و مشکل performance پیش بیاد.

⚠️ نکته: به جای استفاده از unsubscribe ها در event های rx بهتره از takeUntilDestroyed استفاده کنید که خودکار بعد از destroy شدن component تون subscription رو unsubscribe کنه

📌مفهوم‌های Lifecycle hooks نشون می‌ده چقدر رفتار component رو توی اپلیکیشن واقعی درست می‌فهمی.

➡️ ادامه: روز ۳ به‌زودی… (Change Detection و OnPush Strategy) ⚡️🧠

✍🏻 منتظر نظرات و پیشنهاد‌های سازنده‌تون هستم.

#angularlifecycles
#angular
@angularcafe

#Angularinterview

سوال و جواب مصاحبه‌ای Angular - روز سوم (OnPush strategy و Change Detection)

ادامه‌ی سری روزانه مصاحبه Angular؛ این بار موضوعی رو می‌گیم که معمولاً مصاحبه‌کننده‌ها باهاش میزان شناختت از performance رو می‌سنجن.

🔹 موضوع روز ۳: Change Detection در Angular

1️⃣ سوال: Change Detection چیه؟
پاسخ: Change Detection مکانیزمیه که Angular باهاش تغییرات داده رو با UI همگام می‌کنه. هر وقت state اپلیکیشن تغییر کنه، Angular componentها رو بررسی می‌کنه و اگر لازم باشه DOM رو update می‌کنه.

2️⃣ سوال: Angular چه زمانی Change Detection رو اجرا می‌کنه؟
پاسخ: Change Detection معمولاً در این حالت‌ها اجرا می‌شه:
• حالت ۱: User eventها (مثل click و input)
• حالت ۲: HTTP responseها
• حالت ۳: Timerها (مثل setTimeout و setInterval)
• حالت ۴: Promiseها و Observableها

⚠️ نکته: این جریان معمولاً با Zone.js مدیریت می‌شه.

3️⃣ سوال: Default Change Detection strategy چیه؟
پاسخ:
• مورد: Angular همه‌ی componentها رو در component tree بررسی می‌کنه‌ (در صورت استفاده از Zone.js)
• مورد: ساده و قابل‌فهمه، ولی توی اپ‌های بزرگ می‌تونه باعث مشکل performance بشه

4️⃣ سوال: OnPush Change Detection چیه؟
پاسخ: OnPush به Angular می‌گه فقط وقتی Change Detection رو اجرا کنه که:
• مورد: reference مربوط به input تغییر کنه
• مورد: داخل خود component یک event رخ بده
• مورد: یک observable با async pipe مقدار جدید emit کنه

📌 نتیجه: این کار معمولاً performance رو خیلی بهتر می‌کنه.

5️⃣ سوال: چه زمانی بهتره از OnPush استفاده کنیم؟
پاسخ:
• مورد: اپلیکیشن‌های بزرگ
• مورد: componentهایی که با immutable data کار می‌کنن
• مورد: componentهای reusable یا presentational

6️⃣ سوال رایجِ ادامه‌دار تو مصاحبه
👉 چرا با OnPush بعضی وقت‌ها UI update نمی‌شه؟
چون reference آبجکت تغییر نکرده - Angular به immutability تکیه می‌کنه.

📌 فهمیدن Change Detection یعنی تجربه‌ی واقعی Angular داری، نه فقط بلد بودن syntax.

➡️ ادامه: روز ۴ به‌زودی… (Directives - Structural vs Attribute) ⚡️🧠

#Angularinterview
@angularcafe

#Angularinterview

سوال‌ و جواب مصاحبه Angular - روز چهارم (Directive‌ها)

ادامه‌ی سری روزانه مصاحبه Angular؛ این بار سراغ مفاهیمی می‌ریم که مصاحبه‌کننده‌ها انتظار دارن هم شفاف توضیحش بدی، هم با مثال واقعی.

🔹 موضوع روز ۴: Angular Directives

1️⃣ سوال: Directive در Angular چیه؟
پاسخ: Directive یک class هست که به elementهای موجود در DOM رفتار اضافه می‌کنه یا نحوه‌ی render شدن elementها رو تغییر می‌ده.

2️⃣ سوال: انواع Directiveها در Angular چی‌ها هستن؟
پاسخ:
• یک: Component Directives
خود componentها هم نوعی directive هستن که template دارن.

• دو: Structural Directives
ساختار DOM رو با اضافه/حذف کردن elementها تغییر می‌دن.
مثال‌ها: ngIf، *ngFor، *ngSwitch‌* که با control flow جدید 17+ انگولار بیشتر شون دیگه استفاده نمیشن

• سه: Attribute Directives
ظاهر یا رفتار یک element رو تغییر می‌دن.
مثال‌ها: ngClass، ngStyle، و directiveهای custom

3️⃣ سوال: فرق اصلی Structural و Attribute Directive چیه؟
پاسخ:
• یک: Structural: معمولاً با * شروع می‌شن و layout/ساختار DOM رو تغییر می‌دن
• دو: Attribute: مثل یک attribute روی element قرار می‌گیرن و رفتار/ظاهر همون element رو تغییر می‌دن

4️⃣ سوال: چرا Angular فقط اجازه می‌ده روی هر element یک Structural Directive داشته باشیم؟
پاسخ:
چون هر Structural Directive خودش DOM رو دست‌کاری می‌کنه.
⚠️نکته: اگر چندتا لازم داشتی، باید elementها رو داخل ng-container (یا یک wrapper مناسب) قرار بدی.

5️⃣ سوال: چطور یک Attribute Directive سفارشی می‌نویسی و چه کاربرد واقعی‌ای داره؟
پاسخ: Attribute Directive زمانی به‌درد می‌خوره که بخوای یک رفتار یا ظاهر تکرارشونده رو به چندین element اضافه کنی، بدون اینکه هر بار توی componentها کد تکراری بنویسی.
مثلاً یک directive برای permission یا highlight:
element رو بر اساس نقش کاربر disable/hidden می‌کنه
یا روی hover / focus استایل خاص می‌ده
یا یک behavior مثل auto-focus، auto-select، debounce input و… اضافه می‌کنه

📌 نکته مصاحبه‌ای:
یک Attribute Directive معمولاً با ElementRef و Renderer2 کار می‌کنه تا مستقیم DOM رو دست‌کاری نکنی و استاندارد Angular رو رعایت کنی.

➡️ ادامه: روز ۵ به‌زودی… (Services و Dependency Injection) ⚡️🧠

#Angularinterview
@angularcafe

🚀 ۲۰ تا سوال حرفه‌ای مصاحبه Angular که هر دولوپری باید تمرینشون کنه

1️⃣ در مورد Angular Change Detection کامل توضیح بده. Zone.js دقیقاً پشت‌صحنه چطوری کار می‌کنه؟

2️⃣ فرق Change Detection با حالت Default و OnPush چیه؟

3️⃣ فرق switchMap، mergeMap، concatMap و exhaustMap چیه؟ با مثال واقعی توضیح بده.

4️⃣ مفهوم Dependency Injection تو Angular از داخل چطوری کار می‌کنه؟

5️⃣ از Angular Signals چی میدونی و چه فرقی با RxJS Observable دارن؟

6️⃣ چه چیزهایی باعث memory leak تو پروژه‌های Angular می‌شن و چطوری می‌شه جلوشون رو گرفت؟

7️⃣ فرق Subject، BehaviorSubject، ReplaySubject و AsyncSubject چیه؟

8️⃣ تفاوت Standalone Componentها چه مواردی هستن و چطوری باعث بهتر شدن پروژه‌های Angular می‌شن؟

9️⃣ معماری Angular Ivy رو توضیح بده و بگو چه مزیت‌هایی داره.

🔟 قابلیت Server Side Rendering یا SSR تو Angular چطوری کار می‌کنه؟

1️⃣1️⃣ قابلیت Route Guardها تو Angular چی هستن و هر کدوم رو کی باید استفاده کنیم؟

2️⃣1️⃣ مفهوم Lazy Loading چیه و چطوری باعث بهتر شدن performance اپلیکیشن می‌شه؟

3️⃣1️⃣ فرق Reactive Forms و Template Driven Forms چیه؟

4️⃣1️⃣ چرا trackBy تو *ngFor مهمه و چطوری rendering رو سریع‌تر می‌کنه؟

5️⃣1️⃣ قابلیت HTTP Interceptorها چی هستن و تو پروژه‌های واقعی کجاها به درد می‌خورن؟

6️⃣1️⃣ در مورد Lifecycle hookهای Angular توضیح بده و بگو هر کدوم عملاً کجا استفاده می‌شن.

7️⃣1️⃣ فرق ViewChild، ContentChild، ViewChildren و ContentChildren چیه؟

8️⃣1️⃣ اشتباه‌های رایج یا anti-patternهای RxJS که دولوپرها تو پروژه‌های Angular انجام می‌دن چیا هستن؟

9️⃣1️⃣ برای بهتر کردن performance یه پروژه بزرگ Angular چه کارهایی انجام می‌دی؟

0️⃣2️⃣ اگه بخوای یه پروژه Angular بزرگ و enterprise-level طراحی کنی، معماریش رو چطوری می‌چینی؟

#angularinterview
#angularcafe