관리 메뉴

Jerry

[TIL] [타임어택9기][리뉴얼] 타입스크립트 올인원 : Part1. 기본 문법편 - (1) : 타입스크립트는 변수, 매개변수, 리턴값에 붙이는 것 본문

Front/Typescript

[TIL] [타임어택9기][리뉴얼] 타입스크립트 올인원 : Part1. 기본 문법편 - (1) : 타입스크립트는 변수, 매개변수, 리턴값에 붙이는 것

juicyjerry 2024. 2. 22. 00:05
반응형
섹션 1 기본 문법 배우기

 


<타입스크립트는 변수, 매개변수, 리턴값에 붙이는 것>

타입 - 소문자 사용하기
타입  - 자리 기억하기

const a: string = '5';
const b: number = 5;
const c: boolean = true;
const d: undefined = undefined;
const e: null = null;


any를 쓰면 자바스크립트가 된다, 타입스크립트를 쓰는 의미가 없어진다
타입스크립트의 주목적은 any를 제거하는 것

 

 

const f: any = true; 
const g: true = true; // true만 받을 것이다
const h: 5 = 6; // 고정값 받겠다 명시

 



함수 타입 1

// 파라미터 타입 자리와 리턴값 자리 (자리를 잘 기억)
function add(x: number, y: number): number { return x + y }




타입을 지웠을 때 말이 되는 자바스크립트가 되어야 한다;typescript는 최종적으로 javascript로 변환된다(메인룰).
(화살표함수는) 화살표 뒤에 타입이 들어온다 

const add: (x: number, y: number) => number = (x, y) => x + y;

 

 


함수 타입 2
type으로 타입을 선언하는 방식;type alias

type Add = (x: number, y: number) => number;
const add: Add = (x, y) => x + y;



함수 타입 3 

interface Add {
     (x: number, y: number): number;
}

const add: Add = (x, y) => x + y;



객체

const obj: { lat: number, lon: number } = { lat: 37.5, lon: 127.5};

 


배열

const arr: string[] = ['123', '456'];
const arr2: Array<number> = [123, 456]; // 꺽쇠부분은 제네릭



튜플 : 길이가 고정된 배열

const arr3: [number, number, string] = [123, 456, 'hello'];

 

 


※타입스크립트 에러메시지를 꼼꼼하게 읽기!

반응형