# 컴포넌트와 라이프사이클 (Angular)

> Component lifecycle hooks, ngOnInit, ngOnChanges, ngOnDestroy, ngAfterViewInit, component communication, @Input, @Output

- 20 면접 질문
- Junior
- [면접 질문: Angular](https://sharpskill.dev/ko/technologies/angular/interview-questions.md)

## 1. Angular에서 라이프사이클 훅이란 무엇입니까?

**답변**

라이프사이클 훅은 컴포넌트나 디렉티브의 라이프사이클의 핵심 순간에 Angular가 자동으로 호출하는 특별한 메서드입니다. 이러한 훅을 사용하면 생성, 업데이트, 소멸과 같은 특정 단계에서 코드를 실행할 수 있습니다. 가장 일반적인 훅은 ngOnInit, ngOnChanges, ngOnDestroy입니다.

## 2. ngOnInit은 언제 호출됩니까?

**답변**

ngOnInit은 모든 @Input 속성이 초기화된 후, 첫 번째 ngOnChanges 다음에 한 번만 호출됩니다. 컴포넌트 데이터 초기화, 구독 시작 또는 서비스 호출에 이상적인 훅입니다. 모든 바인딩이 사용 가능하다고 보장되므로 초기화 로직에서는 constructor보다 선호됩니다.

## 3. ngOnChanges와 ngOnInit의 주요 차이점은 무엇입니까?

**답변**

ngOnChanges는 @Input 속성 값이 변경될 때마다 호출되며 이전 및 새 값을 포함하는 SimpleChanges 객체를 받습니다. ngOnInit은 첫 번째 초기화 후 한 번만 호출됩니다. 입력 변경에 반응하고 @Input 값에 의존하는 로직을 구현하려면 ngOnChanges를 사용하세요. API 호출이나 초기 구성과 같은 일회성 초기화에는 ngOnInit을 선호하세요.

## 17개 추가 질문 이용 가능

- 컴포넌트에서 ngOnDestroy를 사용하는 이유는 무엇입니까?
- 컴포넌트 생성 시 라이프사이클 훅은 어떤 순서로 호출됩니까?

무료로 가입하기: https://sharpskill.dev/ko/login

## 기타 Angular 면접 주제

- [TypeScript 기초](https://sharpskill.dev/ko/technologies/angular/interview-questions/typescript-basics.md): 25개 질문, Junior
- [TypeScript 고급](https://sharpskill.dev/ko/technologies/angular/interview-questions/typescript-advanced.md): 20개 질문, Junior
- [Angular 기초](https://sharpskill.dev/ko/technologies/angular/interview-questions/angular-fundamentals.md): 20개 질문, Junior
- [Services & Dependency Injection](https://sharpskill.dev/ko/technologies/angular/interview-questions/services-dependency-injection.md): 20개 질문, Junior
- [Angular 모듈 구성](https://sharpskill.dev/ko/technologies/angular/interview-questions/modules-organization.md): 22개 질문, Mid-Level
- [Angular CLI](https://sharpskill.dev/ko/technologies/angular/interview-questions/angular-cli.md): 18개 질문, Junior
- [디렉티브와 Pipe](https://sharpskill.dev/ko/technologies/angular/interview-questions/directives-pipes.md): 22개 질문, Mid-Level
- [라우팅과 내비게이션](https://sharpskill.dev/ko/technologies/angular/interview-questions/routing-navigation.md): 24개 질문, Mid-Level
- [리액티브 폼](https://sharpskill.dev/ko/technologies/angular/interview-questions/forms-reactive.md): 26개 질문, Mid-Level
- [템플릿 기반 폼](https://sharpskill.dev/ko/technologies/angular/interview-questions/forms-template-driven.md): 16개 질문, Mid-Level
- [RxJS 기초](https://sharpskill.dev/ko/technologies/angular/interview-questions/rxjs-fundamentals.md): 22개 질문, Mid-Level
- [RxJS 연산자](https://sharpskill.dev/ko/technologies/angular/interview-questions/rxjs-operators.md): 24개 질문, Mid-Level
- [HttpClient 및 API 호출](https://sharpskill.dev/ko/technologies/angular/interview-questions/http-client.md): 22개 질문, Mid-Level
- [기본 상태 관리](https://sharpskill.dev/ko/technologies/angular/interview-questions/state-management-basics.md): 20개 질문, Mid-Level
- [Change Detection](https://sharpskill.dev/ko/technologies/angular/interview-questions/change-detection.md): 20개 질문, Mid-Level
- [Angular Signals](https://sharpskill.dev/ko/technologies/angular/interview-questions/angular-signals.md): 20개 질문, Mid-Level
- [Standalone Components](https://sharpskill.dev/ko/technologies/angular/interview-questions/standalone-components.md): 18개 질문, Mid-Level
- [Angular 단위 테스트](https://sharpskill.dev/ko/technologies/angular/interview-questions/testing-unit.md): 22개 질문, Mid-Level
- [엔드투엔드 테스팅](https://sharpskill.dev/ko/technologies/angular/interview-questions/testing-e2e.md): 18개 질문, Mid-Level
- [빌드 및 최적화](https://sharpskill.dev/ko/technologies/angular/interview-questions/build-optimization.md): 20개 질문, Mid-Level
- [NgRx 기초](https://sharpskill.dev/ko/technologies/angular/interview-questions/ngrx-fundamentals.md): 24개 질문, Senior
- [NgRx 고급](https://sharpskill.dev/ko/technologies/angular/interview-questions/ngrx-advanced.md): 24개 질문, Senior
- [Angular 아키텍처](https://sharpskill.dev/ko/technologies/angular/interview-questions/angular-architecture.md): 22개 질문, Senior
- [성능 최적화](https://sharpskill.dev/ko/technologies/angular/interview-questions/performance-optimization.md): 22개 질문, Senior
- [보안 및 모범 사례](https://sharpskill.dev/ko/technologies/angular/interview-questions/security-best-practices.md): 20개 질문, Senior
- [고급 RxJS 패턴](https://sharpskill.dev/ko/technologies/angular/interview-questions/advanced-rxjs-patterns.md): 22개 질문, Senior
- [Angular Universal 및 SSR](https://sharpskill.dev/ko/technologies/angular/interview-questions/angular-universal-ssr.md): 20개 질문, Senior
- [Angular 마이크로 프론트엔드](https://sharpskill.dev/ko/technologies/angular/interview-questions/micro-frontends-angular.md): 20개 질문, Senior

---

Source: SharpSkill (https://sharpskill.dev), tech interview preparation for your real stack.
HTML version of this page: https://sharpskill.dev/ko/technologies/angular/interview-questions/components-lifecycle