타입스크립트
-
[TS기초]함수 타입TypeScript 2023. 6. 15. 16:39
목차 1.함수 타입정의하기 2.매개변수 속성 3.함수 오버로딩 1.함수 타입 정의하기 1️⃣함수 선언문 const func(a:number,b:number){ return a+b; //리턴값을 자동으로 추론 } 2️⃣화살표 함수 const add = (a:number,b:number):number =>a+b; //마찬가지로 리턴값을 자동으로 추론하기 때문에 아래와 같이 작성 가능 const add = (a:number,b:number)=>a+b; 3️⃣타입 별칭 -함수 타입 표현식(Function Type Expression) 함수를 타입으로 정의해서 사용한다. 화살표 함수와 문법적으로 유사하다. type Operation = (a:number,b:number) => number; const add: O..
-
[TS기초]객체 타입TypeScript 2023. 6. 15. 10:53
목차 1.객체 타입 정의하기 객체 리터럴 인터페이스 타입별칭 클래스 2.객체 프로퍼티 옵션 인덱스 시그니처 옵셔널 프로퍼티 읽기 전용 프로퍼티 1.객체 타입을 지정하는 여러가지 방법 1️⃣객체 리터럴 타입 :단일로 사용되는 작은 객체를 선언할 때 사용 let user:{ id:string; name:string; } = { id:"아이디", name:"이름", } 2️⃣인터페이스 :재사용 가능한 타입 정의를 위해 주로 사용된다. type User ={ id:string; name:string; } const user:User = { id:"아이디", name:"이름", } 3️⃣타입 별칭 type User ={ id:string; name:string; } const user:User = { id:"아이..
-
[TS기초]기본 타입TypeScript 2023. 6. 13. 20:35
기본타입 기본 타입이란 타입스크립트가 제공하는 기본 내장타입을 말한다. JavaScript의 슈퍼셋 언어인 TypeScript는 JS의 거의 동일한 데이터 타입을 지원하며, 이외에 추가적인 타입을 제공한다. 그 중 기본타입에 대한 내용들을 정리한다. 목차 1.원시타입과 리터럴 타입 2.배열과 튜플 3.Enum타입 4.any타입과 unknown타입 5.void타입과 never타입 1.원시타입과 리터럴 타입 ✨원시 타입(Primitive Type) 하나의 값만 저장할 수 있는 타입. number , string , boolean , null , undefined 등의 속성이 존재한다. let str:string = "문자열"; let num:number = 1; let bool:boolean = true; ..
-
Type Casting(타입 형변환)TypeScript 2023. 6. 5. 17:54
타입 캐스팅은 크게 두 가지 상황에서 사용된다. 1️⃣정확한 타입 추론 타입스크립트가 값의 타입을 추론하지 못할 때 명시적으로 타입을 지정하여 컴파일러에게 알려준다. 2️⃣타입 변환 특정 타입의 기능과 속성을 사용하려고 할 때 사용할 수 있다. 즉, 타입스크립트에서 컴파일러가 직접 감지하지 못하는 특정 타입의 값을 타입스크립트에게 알려주는 역할을 한다. 예를들어 DOM에 있는 HTML요소를 조작한다고 가정해보자. // //app.ts const htmlElement = document.querySelector('p'); htmlElement는 HTML요소나 null로 추론하고 있다.HTML요소를 사용해서 텍스트 내용에 접근하거나, 다른 DOM을 조작하는 작업도 할 수 있겠지만, input의 value값을..