[10주차] 모던 17장 <생성자 함수에 의한 객체 생성>, 우아한 8.1장 <리액트 컴포넌트의 타입>

[202110861]

[10주차] 키워드 및 질문

[모던 자바스크립트 Deep Dive]

<17장 생성자 함수에 의한 객체 생성>

1. Object 생성자 함수
2. 생성자 함수

[우아한 타입스크립트]

<8.1장 리액트 컴포넌트의 타입>

1. 클래스 컴포넌트 타입
2. 함수 컴포넌트 타입
3. Children props 타입 지정
4. render 메서드와 함수컴포넌트의 반환 타입
5. ReactElemnt, ReactNode, JSX.Elemnet 활용하기
6. 사용 예시
7. 리엑트에서 기본 HTML 요소 타입 활용하기

[202110861]

<모던 자바스크립트 Deep Dive>

키워드

• Object 생성자 함수
• 빌트인 생성자 함수
• 생성자 함수

Q1. 생성자 함수 내부에서 return 문을 반드시 생략해야 하는 이유는 무엇인가요?
Q2. 객체 리터럴을 사용했을 때와 생성자 함수를 사용했을 때의 장단점은?

<우아한 타입스크립트>

키워드

• 클래스 컴포넌트 타입
• 함수 컴포넌트 타입
• Children props
• React.ReactElement
• JSX.Element
• React.ReactNode

Q1. React.ReactElement, JSX.Element, React.ReactNode 는 각각 어떤 상황에서 사용하는 것이 좋을까요?
Q2. 클래스 컴포넌트와 함수 컴포넌트에서 ref를 props로 받아 전달하는 방식에는 어떤 차이가 있나요? (버튼으로 예를 들어 설명해주세요.)
Q3. 함수 컴포넌트의 props로 ref를 포함하는 타입을 사용하게 되면 어떤 문제가 있고 어떻게 해결할 수 있나요?

[wlgusqkr]

<모던 자바스크립트 Deep Dive>

키워드
Call
Constructor
this
new.target

Q1. 함수 생성자를 통한 인스턴스 생성과정은?
Q2. new.target의 장점은??

<우아한 타입스크립트>

Q1. JSX.Element에서는 size가 자동완성 되지 않지만 ReactElement에서는 size가 자동완성 되는 이유는?
Q2. 함수형 컴포넌트에서 ref가 연결되지 않는 이유는?

[Stella-516]

<우아한 타입스크립트>
-키워드
React.Component
React.PureComponent
render 메서드

Q. ReactElement, ReactNode, JSX.Element 의 차이를 설명해주세요.

<모던 자바스크립트 딥다이브>
-키워드
Object 생성자 함수
new 연산자
바인딩

Q. 객체 리터럴에 의한 객체 생성 방식의 장점과 단점을 설명해주세요.

[xeunnie]

[모던 자바스크립트 Deep Dive]

키워드

• 생성자 함수와 new 연산자의 동작
• this 바인딩과 암묵적 반환
• new.target / 스코프 세이프 생성자 패턴

Q1. new 없이 생성자 함수를 호출하면 어떤 일이 발생하나요? 이를 방지하는 방법에는 무엇이 있나요?
Q2. new.target과 instanceof를 활용한 생성자 방어 코드를 각각 비교해 설명해주세요. 어떤 차이가 있고 언제 어떤 걸 쓰면 좋은가요?
Q3. 생성자 함수에서 명시적으로 객체나 원시값을 반환할 경우, 어떤 차이가 발생하고 왜 그런지 설명해주세요.

[우아한 타입스크립트]

키워드

• React.FC vs JSX.Element vs React.ReactNode
• PropsWithChildren, ComponentPropsWithoutRef
• forwardRef와 함수형 컴포넌트에서의 ref 처리

Q1. React.FC 대신 JSX.Element나 React.ReactNode를 반환 타입으로 명시하는 경우는 언제이며, 어떤 차이가 있나요?
Q2. 커스텀 Button 컴포넌트를 구현할 때 HTML 의 기본 속성을 모두 지원하고 싶다면 어떻게 타입을 정의하겠습니까?
Q3. 함수형 컴포넌트에서 ref를 전달해야 할 경우 주의할 점은 무엇이며, 어떻게 타입을 지정해야 안전한가요?