[TypeScript]

변수에 타입을 정의하는 방법 name 변수에 타입을 선언하고 시파면 다음과 같이 변수 뒤에 ': 타입이름(ex) string, number boolean...)'을 추가한다. 기본 타입 타입을 정의한 후 다른 타입의 값을 대입하면 에러가 발생한다. 문자열 타입: string 숫자 타입: number 진위 타입: boolean 객체 타입: object...

함수에 타입을 정의하는 방법 반환 값의 타입을 지정하는 방법 파라미터와 반환값의 타입을 지정하는 방법 vscode의 intellisense기능 옵셔널 파라미터 파라미터로 받아야하는 개수가 2개이지만 1개만 넘겨주고 싶다면? lastName뒤에 ?를 붙여 꼭 필요하진 않지만 파라미터로 넘겨받아 쓸 수 있다. (있어도 되고 없어도 되고) 함수에 인자를...

interface란? 객체의 타입을 정의할 때 사용하는 문법 interface로 타입을 정의할 수 있는 부분들 객체의 속성과 타입 함수의 파라미터와 반환 타입 함수의 파라미터 개수와 반환값 여부 배열과 객체의 접근하는 방식 클래스 interface를 이용한 객체의 타입 정의 interface를 이용한 함수 타입 정의 함수의 파라미터 타입 정의 ...

유니언 타입 여러 개의 타입 중 한 개만 쓰고 싶을때 사용하는 문법 | 를 사용하여 사용한다. 유니언 타입의 장점 동일한 동작을하는 함수의 타입이 다르다는 이유로 함수를 하나 더 작성해서 관리해야 하는 불편함을 없애고 코드 중복을 줄일 수 있다. any를 사용하는 방법과 비슷하지만 코드의 자동완성 기능을 사용할 수 있는 타입스크립트의 장점을 취할 수 ...

인터섹션 타입 &를 사용하여 두개의 타입을 하나로 합친다. 타입 2개를 하나로 합쳐서 사용할 수 있는 타입 보통 interface 2개를 하나로 합치거나 타입 정의 여러 개를 하나로 합칠 때 사용한다. 출처: 쉽게 시작하는 타입스크립트

타입 별칭이란? 특정 타입이나 인터페이스 등을 참조할 수 있는 타입 변수를 의미한다. 여러 번 반복되는 타입을 변수화해서 쉽게 표기하고 싶을 때 사용한다. 타입 별칭과 인터페이스 변수에 연결된 타입이 구체적으로 어떤 모양인지 파악할 때는 타입 별칭이 더 좋은 듯 선언된 타입 별칭에 마우스를 올리면 세세한 속성을 볼 수 있지만 인터페이스는 인터페이스의 ...

이넘이란? 특정 값의 집합을 의미하는 데이터 타입 상수의 집합 숫자형 이넘 이넘에 선언된 속성은 기본적으로 숫자 값을 가진다. 이넘 속성의 초기값을 변경하고 싶다면 다음과 같이 선언한다. 문자형 이넘 이넘의 속성 값에 문자열을 연결한 이넘을 의미한다. 숫자형 이넘과는 다르게 모든 속성 값을 다 문자열로 지정해 주어야 한다. 속성 이름과 값을 동...

클래스란? 여러 가지 유사한 객체를 쉽게 생성하는 자바스크립트 최신 문법(ES6+) 생성자 함수 함수의 첫 글자를 대문자로 작성한다. new 키워드를 붙여 호출하면 새로운 객체를 생성해준다. 클래스 기본 문법 Person클래스 코드는 name과 skill값을 받아 객체를 생성할 수 있게 생성자 메서드(constructor)를 선언하고, sayHi()라는...

제네릭이란? 타입스크립트를 사용하여 작성된 코드의 중복을 효과적으로 줄이고 고급 문법을 작성할 수 있게 도와준다. 타입을 미리 정의하지 않고 사용하는 시점에 원하는 타입을 정의해서 사용할 수 있는 문법. 함수의 파라미터와 같은 역할을 한다. 제네릭의 기본 문법 함수를 호출할 때 제네릭에 문자열 데이터 타입인 string타입을 할당한다. 할당된 타입이 ...

타입 추론이란? 타입스크립트가 코드를 해석하여 적절한 타입을 정의하는 동작을 의미한다. 변수를 초기화하거나 함수의 파라미터에 기본값을 설정하거나 반환값을 설정했을때 지정된 값을 기반으로 적당한 타입을 제시하고 정의해 주는 것을 타입 추론이라고 한다. 변수의 타입 추론 과정 아래 코드처럼 변수가 선언되는 시점에 값이 할당되지 않아 어떤 값이 들어올지 모른...

타입 단언이란? 타입스크립트가 해주는 타입 추론에 기대지 않고, 개발자가 직접 타입을 명시하여 해당 타입으로 강제하는 것을 의미한다. as라는 키워드를 사용하여 타입을 단언할 수 있다. as 키워드를 붙이면 타입스크립트가 컴파일할 때 해당 코드의 타입 검사는 수행하지 않는다. as 또는 ! 키워드를 사용하여 타입 단언을 할 수 있지만 단순히 편리함 때...

타입 가드란? 여러 개의 타입으로 지정된 값을 특정 위치에서 원하는 타입으로 구분하는 것을 의미한다. 넓은 타입에서 좁은 타입으로 타입 범위를 좁힌다는 의미로 볼 수 있다. if문을 사용하여 타입 가드 역할을 하고, if문 안에서는 타입이 string이기 때문에 string에 대한 API를 미리 자동 완성으로 사용할 수 있다. 타입 가드가 필요한 이유...

타입 호환이란? 서로 다른 타입이 2개 있을 때 특정 타입이 다른 타입에 포함되는지를 의미한다. 다른 언어와의 차이점 구조적 타이핑 타입의 유형보다 타입의 구조로 호환 여부를 판별하는 언어적 특성을 의미한다. me변수와 son변수에 타입 별칭과 인터페이스를 사용하여 타입을 정의했지만 구조적으로 동일한 속성과 값을 가지고 있기 때문에 호환이 가능하여 에러...

모듈이란? 프로그래밍 관정에서 특정 기능을 갖는 작은 단위의 코드를 의미한다. JS 모듈 태생적 한계 JS는 모듈이라는 개념이 없던 프로그래밍 언어이다. 파일별로 변수나 함수를 구분해서 정의하더라도 기본적으로 모두 전역 유효 범위를 갑는 것이 JS의 특징이다. 애플리케이션의 코드가 많아 질수록 이름이 서로 출돌하지 않게 유일한 변수나 함수 이름을 고민...

유틸리티 타입이란? 이미 정의되어 있는 타입 구조를 변경하여 재사용하고 싶을 때 사용하는 타입 미리 정의해 놓은 내장 타입이기 때문에 타입스크립트를 설치한 후 설정 파일의 lib속성만 변경 해주면 된다. Pick 유틸리티 타입 특정 타입의 속성을 뽑아서 새로운 타입을 만들어 낼 때 사용한다. 예시 문법 첫 번째로 넘긴 타입과 두 번째로 넘긴 타입으로 ...

Partial 유틸리티 타입 특정 타입의 모든 속성을 모두 옵션 속성으로 변환한 타입을 생성해준다. 주로 HTTP PUT처럼 데이터를 수정하는 REST API를 전송할 때 종종 사용되는 타입이다. Pick, Omit과 같이 객체 형태의 타입만 대상 타입으로 취급할 수 있다. 제네릭의 타입을 넣어준 속성들이 전부 옵셔널 처리된다. 문법 예시 특정 타입...

Exclude 유틸리티 타입 유니언 타입을 구성하는 특정 타입을 제외할 때 사용한다. Pick, Omit, Partial타입과 다르게 Exclude 타입은 유니언 타입을 변형한다. 문법 첫 번째 제네릭 타입에 변형할 유니언 타입을 넣고, 두 번째 제네릭 타입으로 제외할 타입 이름을 문자열 타입으로 적거나 문자열 유니언 타입으로 넣어준다. 예시 제외할 ...

Record 유틸리티 타입 타입 1개를 속성의 키로 받고 다른 타입 1개를 속성 값으로 받아 객체 타입으로 변환해준다. 예시 첫 번째 제네릭 타입으로 받았던 HeroNames의 문자열 타입을 키로, 값은 두 번째 제네릭으로 받았던 HeroProfile타입의 형태를 갖는다. 첫 번째와 두 번째 제네릭 타입으로 모두 문자열을 넘겨, 타입을 생성하고 키와 값이...

맵드 타입(mapped type)이란? 이미 정의된 타입을 가지고 새로운 타입을 생성할 때 사용하는 타입 문법 예시: in in 키워드를 사용하여 유니언 타입으로 지정된 문자열들을 키로, boolean값을 속성 값으로 정의한다. JS의 for...in 문법과 같이 유니언의 갯수만큰 반복문을 돌며 키와 속성값을 설정한다. 예시: Keyof keyof는 ...