[이넘]
1. 이넘을 선언할 때 const를 붙인 것과 붙이지 않은 것은 어떤 차이가 있는지 JS 변환 코드와 관련지어 설명해주세요.
이넘 코드가 자바스크립트 코드로 컴파일될 때 이넘의 속성 키와 값을 연결해 주는 즉시실행함수를 생성합니다.
반면 const 이넘은 이 함수 없이, 이넘이 사용되는 곳에서 속성 값을 바로 연결해 줍니다
따라서 const 이넘을 사용하면 컴파일 시 코드양을 줄일 수 있습니다.
2. TypeScript의 이넘은 어떤 상황에서 사용되나요? 그리고 어떤 장점과 단점을 가지고 있나요?
이넘의 장점
1. 생산성과 가독성의 증대
이넘은 열거형 코드로 의미있는 이름으로 부여할 수 있어 코드에 대한 이해와 가독성이 증대됩니다.
2. 타입 안정성 증대
이넘은 key-value 양방형 관계이기 때문에 value에 유효하지 않은 값이 오면 컴파일러 수준에서 에러를 감지할 수 있습니다. 이로 인해 런타임 에러를 방지하고 안정적인 코드를 작성할 수 있습니다.
이넘의 단점
1. 컴파일시 코드 양이 늘어남
컴파일 시 key-value 로 정의되기 때문에 코드양이 늘어납니다.
2. Tree-Shaking이 되지 않음
트리쉐이킹이란 간단히 말해서 사용하지 않는 코드를 삭제하는 기능입니다. 타입스크립트는 자바스크립트에 없는 이넘을 구현하기 위해서 즉시실행함수를 포함한 코드를 생성합니다. 그러나 Rollup과 같은 번들러는 즉시실행함수를 '필요하지 않은 코드'라고 판단할 수 없어서 Tree-Shaking이 되지 않습니다. 이넘코드를 사용하지 않더라도 최종적으로 번들에는 남아있게 됩니다.
3. enum Enum { A } let a = Enum.A; let keyName = Enum[a]; 이러한 과정이 무엇인지 한 단어(5글자)로 말하고, console.log(keyName); 하면 무엇이 나오나요
속성으로 값을 얻고 있고 값으로 속성을 얻고 있습니다.
이렇게 이넘의 속성과 값이 거꾸로 연결되어 할당되는 것을 리버스 매핑이라고 합니다.
console에는 A가 출력됩니다.
4. 문자형 이넘에서는 이러한 과정이 왜 지원되지 않는지 설명해주세요
숫자형 이넘에서는 속성이 기본적으로 숫자값을 갖고 순서대로 증가하므로, 값을 이용하여 속성 이름을 역으로 찾을 수 있습니다.
하지만 문자형 이넘은 값이 문자열이나 다른 이넘값으로 매핑됩니다. 따라서 문자 이넘에서 리버스 매핑을 시도하려고 하면 에러가 발생합니다.
[타입 별칭]
1. 타입 별칭과 인터페이스의 차이를 설명하고 각자 언제 사용하는 것이 좋은지 말해보세요.
1. 타입 별칭과 인터페이스의 차이
타입별칭은 모든 타입을 선언할 때 사용할 수 있고, 인터페이스는 오직 객체 타입만 선언할 때 사용할 수 있습니다.
그리고 타입별칭과 인터페이스의 가장 큰 차이점은 확장성의 여부라고 할 수 있습니다.
인터페이스는 같은 이름으로 다른 타입을 선언할 수 있어 새로운 프로퍼티를 추가할 때 수월합니다.
하지만 타입 별칭은 같은 이름으로 다른 타입을 선언할 수 없습니다.
2. 언제 사용하면 좋을 까?
인터페이스는 기존의 인터페이스에 병합이 필요할 때 사용합니다.
단순한 원시값이나 튜플 유니언 등의 타입을 선언할 때는 타입별칭을 사용합니다.
https://funes-days.com/dev/difference-of-type-alias-and-interface-in-typescript
[클래스]
클래스 접근 제어자는 무엇이 있는지 말하고 각 클래스 접근 제어자에 대해서 설명해보세요.
클래스 접근 제어자 종류와 역할
클래스 접근 제어자로는 public, private, protected 이렇게 3가지가 있습니다.
기본적으로 public이 선언되고, 부모 클래스의 변수와 메서드에 접근이 가능합니다.
private을 선언하면 부모 클래스에서만 접근이 가능합니다. proteced를 선언하면 자식 클래스에선 접근이 가능하지만, 인스턴스에서는 접근할 수 없습니다.
[인덱스 시그니쳐]
1. TS에서 인덱스 시그니쳐를 활용할 때, 속성의 타입으로 문자열과 숫자 둘다 사용시 생길 수 있는 문제를 설명해주세요.
인덱스 타입을 문자열과 숫자 둘다 사용하게 되면, 넘버 타입 인덱스 시그니쳐에서 타입 에러가 발생할 수 있습니다.
2. 1번 문제가 왜 발생하는지 JS 색인의 동작 과정을 통해 설명해주세요.
JavaScript에서 객체의 인덱스에 접근할 때, 내부적으로 인덱스의 toString 메소드를 호출해 문자열로 변환된 값을 인덱스로 사용합니다. 따라서 인덱스 타입을 넘버로 정의했어도, 문자열로 변환되기 때문에 최종적으로 문자열타입의 인덱스 시그니처에 접근하게 되는 것입니다. 만약 문자와 넘버 인덱스 시그너처의 속성 값이 일치하지 않는다면 에러가 발생하게 됩니다.
[제네릭]
1. 동일한 동작을 하는 코드를 타입 때문에 중복으로 선언하거나, 혹은 any 타입으로 선언하면 어떤 문제가 있을까요? 제네릭을 활용한다면, 이를 어떻게 해결할 수 있을지 설명해주세요.
1. 동일한 동작을 하는 코드를 타입 때문에 중복 선언하거나 혹은 any 타입으로 선언하면 발생하는 문제
코드를 중복 선언하게 되면 유지보수가 어려워 진다는 문제가 발생할 수 있습니다. 그리고 any 타입으로 선언하게 되면, 타입스크립트의 타입검사 기능을 지원받지 못합니다. 따라서 개발 과정에서 오류를 발견하기 어려울 수 있습니다.
2. 제네릭으로 어떻게 해결할 수 있을까
이렇게 타입을 미리 정할 수 없는 경우에는 제네릭을 사용하면 됩니다. 제네릭은 선언 시점이 아닌 생성 시점에 타입을 정의하기 때문에 한 번의 선언으로 다양한 타입에 재사용이 가능합니다.
2. 제네릭을 사용한다면, 타입을 미리 정의하지 않고 호출 시점에 타입을 정의할 수 있습니다. 여기서 모든 타입이 아니라, 특정 타입으로만 제네릭으로 받을 수 있게끔 제약하고자 할 때 사용하는 키워드는 무엇이 있는지 설명해주세요.
extends 와 keyof 키워드를 사용해서 타입의 종류를 제약할 수 있습니다.
extends 뒤에 제한 조건을 걸고, 제네릭에 keyof를 사용해서 객체의 key값에 조건을 걸 수 있습니다.
