타입스크립트
-
typescript classProgramming/JavaScript & TypeScript 2022. 2. 20. 13:27
01. what are classes object를 만드는 설계도 클래스 이전에 object를 방법은 function javascript es6에서부터 class 키워드 사용가능 (접근제어자 부족...) typescript에서는 클래스도 사용자가 만드는 타입중에 하나 02. Quick Start - class 기본 형태 class Person {} const p1 = new Person(); console.log(p1) tsconfig.json에서 target을 es5로 넣고, 컴파일해보면 class가 function으로 구현되어 있는걸 볼 수 있다. "use strict"; var Person = /** @class */ (function () { function Person() { } return P..
-
typescript InterfaceProgramming/JavaScript & TypeScript 2022. 2. 18. 14:23
01. Wath art Interfaces 어떤 type을 만들어 내는 방식 예전에는 내부적으로 숨겨져있고, 외부적으로 드러나는 호출 방식 내부적인것과 관계없이 외부적으로 들어나는 객체의 사용방식 //interface가 없으면 function hello2(person:{name:string, age:number}): void{ console.log(`hi my name ${person.name}, age is ${person.age} `); } //interface 사용하면... interface Person1 { name:string, age:number } function hello1(person:Person1): void{ console.log(`hi my name ${person.name}, ag..
-
TypeScript Compiler(타입스크립트 컴파일러)Programming/JavaScript & TypeScript 2022. 2. 16. 17:17
Compilation Context Typescript deep dive를 참고 많이 하자 (https://radlohead.gitbook.io/typescript-deep-dive/) 어떤 파일을 컴파일 할건지, 안할건지 타입스크립트를 컴파일할때 어떤 방식 사용할건지 정하는 것 tsconfig.json에 설정(최상위 프로퍼티는 공부해야한다.) TypeScript => TypeScript Compiler => JavaScript tsconfig schema https://json.schemastore.org/tsconfig tsconfig의 전체 schema를 볼 수 있다. 어떤 옵션을 키느냐에 따라서 typescript의 빌드 환경이 달라진다. compileOnSave save하면 compile을 활성..
-
타입 별칭(Type Alias)Programming/JavaScript & TypeScript 2022. 2. 16. 16:53
타입에 다른 이름을 붙여주는것 Interface랑 비슷해 보인다 Primitive, Union Type, Tuple, Function, 기타 직접 작성해야하는 타입을 다른 이름으로 지정할 수 있다. 별명 개념으로 보면 된다. https://www.digitalocean.com/community/tutorials/typescript-type-alias How To Use Type Aliases in TypeScript | DigitalOcean www.digitalocean.com https://laikhan-workshop.tistory.com/45 void; TypeAlias와 interface를 사용하는 기준 타입이 목적, 존재 가치가 명확하면 interface, 대상을 가리키면 typealias 사..
-
타입 호환성(type Compatibility)Programming/JavaScript & TypeScript 2022. 2. 16. 16:17
타입 호환성 하위타입에는 상위타입이 들어갈 수 없다. //sub1은 sup타입의 서브타입니다. let sub1:1 = 1; let sup1:number = sub1; //sub1 = sup1 //Type 'number' is not assignable to type '1'. //sub2타입은 sup2의 서브타입니다. let sub2:number[] = [1] let sup2:object = sub2 //sub2 = sup2 //error, //sub3은 sup3타입의 서브 타입니다. let sub3:[number, number] = [1,2]; let sup3:number[] = sub3 //sub3 = sup3 error let sub4 :number = 1 let sup4:any = sub4 sub4..
-
TypeSystemProgramming/JavaScript & TypeScript 2022. 2. 16. 15:51
타입스크립트의 타입 체계를 이해하는데 도움이 된다. 타입스크립트는 Structual Type System을 따른다. Structual Type System 구조가 같으면 같은 타입이다. interface IPerson { name:string; age:number; speak():string; }; type PersonType = { name:string; age:number; speak():string }; let personInterface : IPerson = {} as any; let personType : PersonType = {} as any; // 같은 구조니까 대입 가능 personInterface = personType personType = personInterface Nominal ..
-
사용자의 관점으로 코드 바라보기Programming/JavaScript & TypeScript 2022. 2. 16. 15:44
타입스크립트의 타입 시스템 1) 명시적으로 지정 가능 2) 지정하지 않으면 타입 스크립트 컴파일러가 자동으로 추론 타입이란 해당 변수가 할 수 있는 일을 결정하는 것 function f1(a){ return a } a가 무슨 타입이냐에 따라서 할 수 있는 일이 달라진다. 자바스크립트는 함수 사용법에 대해서 오해를 야기할 수 있다. function f2(a){ return a*38; } console.log(f2(10)); // 380 console.log(f2('Mark')) // NaN 과연 함수 작성자는 어느걸 의도했을까? 타입 스크립트에서는 명시적으로 지정하지 않으면 Any로 추론 된다. 함수 작성자는 올바른 사용법을 사용자에게 전달하지 않은것 noImplicitAny 옵션을 켜면... 타입을 명시..
-
Primitive TypeProgramming/JavaScript & TypeScript 2022. 2. 15. 10:33
Primitive Type Object와 레퍼러스 형태가 아닌 실제 값을 저장하는 자료형 프리미티브 형의 내장함수를 사용가능하는 것은 자바스크립트 처리 방식 가능 ex) let name = 'mark' name.toString() 종류 - boolean, number, string, symbol, null, undefined literal 값으로 Primitive 타입의 서브 타입을 나타낼수 있다. true (Boolean의 subType) 'hello' (String의 subType) 3.14 null undefined 또는 래퍼 객체로 만들 수 있다. 이건 오브젝트임 ..타입스크립트에서는 이렇게 쓰는것을 추천하지 않음 new Boolean(false); // typeof new Boolean(fals..