본문 바로가기

Typescript 공부9

Typescript 제네릭 * 조시 골드버그의 러닝 타입스크립트라는 책을 읽고 정리하면서 코드를 작성해본 내용입니다. 타입스크립트를 사용할 때 항상 타입을 선언할 수 있는것은 아니다. 예를 들어 다음과 같은 함수가 있을 때 매개변수의 타입에 따라 반환값이 달라지고, 어떤 매개변수가 들어올지 모르기 때문에 any로 설정할 수 밖에 없다. 이러한 경우 타입검사기의 보호를 받을 수 없다. input 타입과 함수 반환 타입간의 관계를 말할 수 있는 방법이 필요한데, 타입스크립트에서는 제네릭(Generic)을 사용하여 타입간의 관계를 나타낼 수 있다. 제네릭 타입 매개변수는 제네릭 구조체의 사용법에 따라 타입이 결정된다. 와같은 방식으로 제네릭을 선언할 수 있다. 1. 제네릭 함수 매개변수 괄호 앞에 사이에 타입매개변수 별칭을 넣으.. 2023. 3. 16.
Typescript 타입 제한자 * 조시 골드버그의 러닝 타입스크립트라는 책을 읽고 정리하면서 코드를 작성해본 내용입니다. 1. top 타입 top 타입은 시스템에서 가능한 모든 타입을 나타내는 타입이다. 즉, 모든 타입은 top타입에 할당할 수 있다. 1.1 any 타입 any타입은 모든 타입 위치에서 제공될 수 있는 top타입처럼 작동할 수 있다. any타입을 지정한다는 것은 타입스크립트의 타입검사기를 사용하지 않겠다는 것이다. 이러면 타입스크립트를 사용하는 의미가 없기 때문에 any타입은 사용하지 않는것을 권장한다. 어떤 값이든 될 수 있음을 나타내려면 unknown 타입이 훨씬 안전하다. 1.2 unknown 타입 타입스크립트에서의 진정한 top 타입은 unknown 타입이다. any타입과 마찬가지로 모든 값을 할당할 수 있다... 2023. 3. 11.
Typescript 클래스 * 조시 골드버그의 러닝 타입스크립트라는 책을 읽고 정리하면서 코드를 작성해본 내용입니다. 1. 클래스와 메서드 타입스크립트는 일반 함수와 마찬가지로 메서드를 이해한다. 매개변수 타입이나 인수 개수를 추론하고, 반환 타입을 지정하지 않으면 추론 가능하다. 클래스의 constructor도 메서드와 마찬가지로 취급된다. 인스턴스를 생성할 때 인수의 타입과 개수가 알맞은지 확인한다. 2. 클래스 프로퍼티 타입스크립트에서 클래스의 프로퍼티를 읽거나 쓰려면 명시적으로 선언해야 한다. 클래스 프로퍼티는 인터페이스와 동일한 구문으로 작성한다. 프로퍼티 이름 뒤에 선택적으로 타입 애너테이션을 붙일 수 있다. 선언되지 않은 프로퍼티에 값을 할당하려고 하면 에러가 발생한다. 클래스에 명시적으로 프로퍼티를 선언함으로써 클래.. 2023. 3. 9.
Typescript 인터페이스 * 조시 골드버그의 러닝 타입스크립트라는 책을 읽고 정리하면서 코드를 작성해본 내용입니다. 인터페이스(interface)는 연관된 이름으로 객체 형태를 설명하는 또다른 방법이다. 인터페이스는 타입 별칭(type)과 유사하지만 일반적으로 더 읽기 쉬운 오류 메시지, 더 빠른 컴파일러 성능, 클래스와의 더 나은 상호 운용성을 위해 선호된다. 1. 타입 별칭(type) vs 인터페이스(interface) 두 구문은 거의 비슷하다. 차이점은 다음과 같다. ⓵ 인터페이스는 속성 증가를 위해 병합할 수 있다.(이 장 뒷부분에 설명) 이 기능은 외부 코드(라이브러리 등)를 사용할 때 특히 유용하다. ⓶ 인터페이스는 클래스가 선언된 구조의 타입을 확인하는 데 사용할 수 있지만 타입 별칭은 사용할 수 없다. ⓷ 일반적으.. 2023. 3. 5.
Typescript 배열 * 조시 골드버그의 러닝 타입스크립트라는 책을 읽고 정리하면서 코드를 작성해본 내용입니다. 자바스크립트에서의 배열은 어떤값이라도 요소로 가질 수 있다. 그러나 이러한 경우는 흔치 않으며 대부분 하나 혹은 두개의 타입만 가지는 배열을 사용한다. 타입스크립트에서는 초기 배열에 어떤 데이터 타입이 있는지 기억하고 배열이 해당 데이터 타입만 요소로 가질 수 있도록 제한한다. 명시적인 데이터타입을 선언하지않으면 초기값에서 코드의 의도를 이해하려고 시도한다. 1. 배열 타입 배열의 타입 애너테이션은 배열의 요소 타입 다음에 []가 와야 한다. Array 같은 구문도 사용가능하다. 배열과 함수 타입 괄호를 사용하여 어느 부분이 함수타입이고 어느 부분이 배열타입인지 나타낼 수 있다. 괄호의 위치에 따라 완전히 다른 타.. 2023. 3. 3.
Typescript 함수 * 조시 골드버그의 러닝 타입스크립트라는 책을 읽고 정리하면서 코드를 작성해본 내용입니다. 타입스크립트를 사용할 때 함수의 매개변수, 반환값에도 타입을 지정할 수 있다. 1. 매개변수 매개변수에 타입을 지정하지 않으면 어떤 타입의 값이 들어올지 알 수 없는 any타입으로 지정된다. 위의 코드는 정상적으로 실행은 되겠지만 타입스크립트의 타입검사 기능을 사용하지 못하는 코드이다. 타입스크립트의 보호를 받기위해 타입을 지정해 주는것이 좋다. 필수 매개변수 자바스크립트에서는 인수의 수와 상관없이 함수를 호출할 수 있지만, 타입스크립트에서는 선언된 필수 매개변수가 없거나 선언한 개수보다 많으면 오류가 발생한다. 선택적 매개변수 타입 애너테이션 : 앞에 ? 를 추가하면 선택적 매개변수로 설정할 수 있다. 선택적 매.. 2023. 3. 1.