본문 바로가기

Front-end/Typescript4

[TypeScript] Interface tyep, interface 둘다 타입스크립트에게 오브젝트의 모양을 설명해 주기 위해 존재한다. TypeScript 사용 방법 1 (type alias) type Food = string; const kimchi:Food = "delicious" TypeScript 사용 방법 2 (concrete type) type Player = { ninckname: string, healthBar: number } const nico: Player = { ninckname: "jigyeong", healthBar: 1 } TypeScript 사용 방법 3 (concrete value) type Team = "red" | "blue" | "yellow" type Player2 = { team:Team, ninckna.. 2022. 8. 1.
[TypeScript] Class 아래와 같이 class 를 작성하면 class Player { constructor ( private firstName:string, private lastName:string, public nickname:string ){} } const user1 = new Player('first','last','nick'); 아래와 같이 javascript 로 나타내진다. "use strict"; class Player { constructor(firstName, lastName, nickname) { this.firstName = firstName; this.lastName = lastName; this.nickname = nickname; } } const user1 = new Player('first', '.. 2022. 8. 1.
[TypeScript] Generics 미리 함수 type을 정의해 놓을 수 있다. type Add = (a:number, b:number) => number; const add:Add = (a,b) => a+b; Overloading Parameter Type 에 따라서 처리 type Config = { // 객체에 대한 정의 path: string state: string } type Push = { // 함수에 대한 정의 (path: string): void (config: Config): void } const push: Push = (config)=>{ if(typeof config === "string") console.log(config) else console.log(config.path, config.state) } Param.. 2022. 7. 25.
[TypeScript] Basic Overview Javascript 는 인터프리터 언어. (내부 엔진에서 컴파일을 진행하기도 함) Typescript 는 컴파일 언어. 컴파일 하고나면 보호장치 없는 자바스크립트로 바뀜. ?: → (옵션) type이 있거나 undefined 임. type Player = { name: string, age?: number } // makePlayer = makePlayer2 function makePlayer (name:string) : Player{ return {name} } const makePlayer2 = (name:string) : Player => ({ name }) let player = makePlayer("ning"); player.age = 1 // Player type 명시해줘서 age 라는 par.. 2022. 7. 21.