[4장] 함수

[dahye1013]

[4장 퀴즈]

함수

아래 마크다운을 복사 붙여넣기해서 코멘트로 퀴즈를 달아주세요 :)
객관식, 주관식에 상관없이 편하게 만들어주세요!

부가 설명을 달고 싶다면, 해설을 정답과 함께 옵션으로 작성하시면 됩니다. ☺️

예시

퀴즈 내용 객관식의 정답을 골라보세요!
(퀴즈 내용)
1. 1번 
2. 2번
3. 3번

<details>
	<summary>퀴즈 정답</summary>
	<div markdown="1">    
	정답은 1번!
	</div>
</details>

[yeomgahui]

다음 map 함수를 TypeScript의 제네릭을 이용하여 구현해 보세요!

function map(array: unknown[], f: (item: unknown)=> unknown): unknown[] {
    let result = [];
    for(let i = 0; i < array.length; i++) {
        result[i] = f(array[i])
    }
    return result;
}

퀴즈 정답

function map<T, U>(array: unknown T[], f: (item: T) => U): U[] {
let result = [];
for(let i = 0; i < array.length; i++) {
    result[i] = f(array[i])
}
return result;

}

[dahye1013]

다음 중 호출 시그니처(call signature) 의 특징이 아닌 것은?

1. 함수 호출 시그니처는 값을 포함한다,
2. 함수 호출 시그니처는 바디를 포함 하지 않는다.
3. 함수 호출 시그니처는 반환 타입을 명시해야 한다.
4. 함수 호출 시그니처는 화살표 함수와 유사한 형태이다.

퀴즈 정답

옳지 않는 것은 1번 입니다!

함수 호출 시그니처는 타입 수준 코드의 타입 정보만 포함합니다. 반환 타입, 나머지 타입, 조건부 타입을 표현할 수 있지만 기본값은 표현할 수 없다. 기본 값은 타입이 아니라 값이다. (69페이지 참조)

[seojihwan]

다음 오버로딩의 문제점은?

declare function fn(x: unknown): unknown;
declare function fn(x: HTMLElement): number;
declare function fn(x: HTMLDivElement): string;

퀴즈 정답

제일 첫번째로 매칭되는 오버로드 함수 타입으로 추론된다. 따라서 general한 타입일수록 후순위에 정의해야한다.

[dahye1013]

1. 아래 조건에 해당하는 요소를 지원하는 호출 시그니처를 작성해보세요
2. 작성한 호출 시그니처 타입을 기반으로 제너릭을 사용하여 수정해보세요.

• 요소에 대응하는 HTMLAnchorElement
• 요소에 대응하는 HTMLCanvasElement
• 요소에 대응하는 HTMLTableElement
  퀴즈 정답

  type createElement = {
    (tag: 'a'): HTMLAnchorElement;
    (tag: 'canvas'): HTMLCanvasElement;
    (tag: 'table'): HTMLTableElement;
    (tag: string): HTMLElement;
  };

  문자열 리터럴 타입으로 오버로드하는 방식입니다. 타입스크립트는 선언 순서대로 오버로드를 해석합니다. 즉, 오버로드에 지정되지 않은 문자열은 HTMLElement로 분류합니다. (매개변수는 제시된 조건과 같이 'a' | 'canvas' | 'table' | string을 지원해야합니다.) 76 페이지 참조

  type createElement<T extends string, U = HTMLElement> = {
    (tag: T): U;
  };

  제너릭을 사용시에 타입이 자동으로 추론되지 않으므로, 타입 매개변수를 명시적으로 한정해야합니다. (89페이지)
  4.2.5와 내용과 같이 상한 한계를 한정하여 다형성을 표현할 수 있습니다. &를 통해 타입을 제한을 추가 할 수 있습니다.
  특정 요소를 알 수 없을때는 제너릭 타입에 기본값을 추가하여 타입을 추론할 수 있습니다.(4.2.6 제너릭 기본값 - 96페이지)

[areumsheep]

아래 코드에서 에러가 나는 이유는?

function fill(length: number, value: string): string[] {
  return Array.from({ length }, () => value);
}
function call<T extends unknown[], R>(f: (...args: T) => R, ...args: T): R {
  return f(...args);
}

let a = call(fill, 10, 'a');
let b = call(fill, 10); //에러: 3개의 인수가 필요하지만 2개가 전달됨

퀴즈 정답

f: (...args: T) => R은 fill 함수를 뜻하고, ...args: T는 fill 함수의 매개변수를 뜻하는 것이므로 fill 함수에는 2개의 매개변수만 받기 때문에 let b에서 오류가 발생했다.

[tooooo1]

1. 제네릭 이름으로 G가 아닌 T를 대중적으로 사용하는 이유는?
2. 제네릭 타입을 개발자가 명시적으로 지정할 수도 있나요?
3. 제네릭 타입의 기본값을 설정하거나 범위를 좁힐 수 있나요?

퀴즈 정답

1. 객체 지향 개발자는 타입(type)을 의미하는 T를 선호한다. 그렇지만 함수형 언어를 선호하는 개발자는 A부터 시작하는 것을 선호하기도 한다. (개인적으로 궁금했었던..알면좋지만쓸데없는)

2. 네. (87p). 그대신 타입을 명시할 때는 모든 필요한 제네릭 타입을 명시하거나 반대로 아무것도 명시해서는 안 돼요.

3. 네 (96p). 예시) <T = HTMLElement>, type MyEvent<T extends HTMLElement = HTMLElement>



</div>