목록TypeScirpt 9
재밌고 어려운 IT를 이해해보자~!
선언type PositionType = { x: number; y: number;};interface PositionInterface { x: number; y: number;}// objectconst obj1: PositionType = { x: 10, y: 1,};const obj2: PositionInterface = { x: 20, y: 2,};일반적으로 객체 타입을 선언하는 거에 있어서 둘이 동일한 방법으로 사용할 수 있다.인터페이스는 당연하겠지만 객체에서만 사용이 가능하다는 점과, Index Signature의 사용 유무 구현type PositionType = { x: number; y: number;};interface PositionInterface { x: numbe..
클래스 정의와 접근제한자기존 모던 자바스크립트의 클래스에서도 접근 제한자가 존재하기는 했는데, 특수문자로 선언을 해줘야 하는 제약이 있었으나 타입 스크립트에서는 자바와 같이 클래스 기반 객체 지향 언어가 지원하는 접근 제한자 public, pivate, protected를 지원하며 의미 또한 동일하다. 클래스 정의class Animal { name: string; constructor(name: string) { this.name = name; } talk() { console.log(`this animal's name is ${this.name}`); } } const animal = new Animal("Ruby"); animal.talk();..
Type Inference타입 추론이란 TypeScript에서 명시적인 타입 표기가 없을 때 타입 정보를 제공하기 위해 사용되는 것이다.그냥 쉽게 말하면 자동으로 타입을 결정해주는 것이라고 보면 된다.let x = 3; // let x: numberlet y = "4"; // let y: stringjavascript처럼 사용하면 typescript는 자동적으로 타입을 추론하여 알맞은 타입을 결정한다.여러 타입을 동시에 사용할 경우 최적 공통 타입을 알아서 계산let x = [0, 1, null]; // let x: (number | null)[]이런 식으로 타입 스크립트는 자동으로 타입을 결정지어 주지만 아무래도 타입 스크립트를 선택해서 사용하는 입장에서는 제대로 명시해서 사용해 주는 게 좋다.Type..
EnumEnum은 그 안에 무슨 값들을 열거했냐에 따라서 Numeric enums, String enums 등으로 불리기도 하는데, 보통 상수들의 집합을 정의하고자 할 때 주로 사용되고는 한다. 숫자 열거형 (Numeric enums)enum Weekdays { Monday, Tuesday, Wednesday, Thursday = 10, Friday, Saturday, Sunday,}let day: Weekdays = Weekdays.Thursday;console.log(day);console.log(Weekdays.Friday); 보통 enum은 위와 같이 사용하고는 하는데, 왜 저게 숫자 열거형이냐 하면 따로 특정한 값이 주어지지 않으면 자동적으로 0부터 숫자가 할당되기 때문Moday =..
Type Aliases기본적으로 타입스크립트는 변수나, 객체, 함수 반환 값 등에 타입을 지정하게 되는데,특히 객체 타입과 유니언 타입을 사용할 때 Type Alias가 필요하다.이는 똑같은 타입을 재사용하거나, 또 다른 이름으로 부르고 싶은 경우에 아주 유용하게 사용 type Point = { x: number; y: number;};function printCoord(pt: Point) { console.log("The coordinate's x value is " + pt.x); console.log("The coordinate's y value is " + pt.y);}let point: Point = { x: 100, y: 100,};printCoord(point); 이런 식으로 객체..
Object 객체 안에 사용되는 모든 값들의 타입을 정해줘야 한다.Javascriptlet obj: object;obj = { name: "mine", age: 3 };obj = { obj: {}, arr: [], boal: true };Typescriptlet obj: { name: string; age: number;} = { name: "it-record", age: 3,};obj.lang = 'typescript';// error : '{ name: string; age: number; }' 형식에 'lang' 속성이 없습니다.기본적으론 object는 이처럼 타입을 지정해주면서 지정된 값들만 넣을 수 있게 만들어야 한다.타입이 길어지다 보면 가독성 역시 많이 떨어지기 때문에, 보통 타입을 ..
String문자열 Number숫자 Boolean참/거짓 (true/false) Null, Undefined기본적으로 null과 undefined는 모든 타입의 하위 타입으로 number 같은 타입에 할당가능 하지만,--strictNullChecks ( tsconfig.json 이나 jsconfig.json 파일에 설정하거나 기본적으로 VSCode 설정 탭에서 설정이 가능.)를 사용하게 되면 null과 undefined는 오직 any 타입과 각자 자신들 타입에만 할당 가능하다. (예외로 undefined는 void에 할당 가능)// 이 밖에 이 변수들에 할당할 수 있는 값이 없어 사용하지 않는다.let u: undefined = undefined;let n: null = null;let num: numbe..
TypeScript는 JavaScript의 슈퍼 셋, 즉 상위 확장자로 JavaScript 엔진을 사용하며 자신이 원하는 변수의 타입을 정의하고 프로그래밍을 하면 JavaScript로 컴파일되어 실행할 수 있다. TypeScript는 정적 타입 언어로 변수의 타입을 명시적으로 지정해서 사용한다!const plus = (a: number, b: number): number => a + b;function minus(a: number, b: number): number { return a - b;}plus(1, 2); // 3: number typeplus("1", 2); // error 'string' 형식의 인수는 'number' 형식의 매개 변수에 할당될 수 없음minus(3, 1); // 2: nu..