TypeScript11 0062. TypeScript 공부하기11 - 클래스, 암묵적 Any 해결법, 접근제어자, 인터페이스와 클래스 섹션 6. 클래스 2강. 타입스크립트의 클래스 1) 암묵적 any 금지 - noImplicitAny 옵션 설정방법 이렇게 타입을 추론할 수 없을 때, any 타입으로 정의한다. any 형식이 매우 위험한 타입이기 때문에 오류를 발생시키는 것이다. 이때, tsconfig.json 파일에서 "noImplicitAny" 옵션을 false로 설정하면 에러가 사라진다. 암시적 any를 허용하지 않을 것이냐? → false 이기 때문에 허용하라는 뜻이다. 하지만, 이 옵션을 설정하면 암시적 any를 봐주기 때문에 타입스크립트를 사용하는 의미가 줄어든다. 그래서 원래 설정값이 꺼져 있으니 그대로 두거라, 옵션을 true로 설정하거나, 주석처리해서 없애는 게 좋고, 상황에 따라서 예외적으로 쓰는 것을 권장한다. 2) .. 2024. 2. 11. 0061. TypeScript 공부하기10 - JavaScript 클래스, 생성자, 인스턴스, 메서드, 프로퍼티, 상속 섹션 6. 클래스 1강. 자바스크립트의 클래스 소개 1) allow.Js : ts 환경에서 js 파일 사용하도록 설정하기 src폴더에 .js파일을 만들면 tscongfig에 오류가 난다. "include" 옵션을 "src"로 설정했기 때문에 src 디렉토리 내의 모든 타입스크립트 파일을 타입스크립트 컴파일러가 관제하고 있다. 모니터링 중 ts 파일이 아닌 js 파일이 생겼기 때문에 오류가 나는 것이다. 그래서 여기에 "allowJs": true를 추가한다. 그러면 오류가 사라진 것을 확인할 수 있다. 2) class let studentA = { name: "초보", grade: "A+", level: 5, study() { console.log("열심히 코딩함"); }, introduce() { con.. 2024. 2. 11. 0060. TypeScript 공부하기9 - 인터페이스, 표기법, 확장, 선언 합치기, 모듈 보강 섹션 5. 인터페이스 1강. 인터페이스 1) 인터페이스란? 인터페이스 : 상호 간에 약속된 규칙 타입에 이름을 지어주는 또 다른 문법 + 객체의 구조를 정의하는데 특화된 문법 (타입 별칭에서는 제공하지 않는 상속, 합침 등의 객체 타입을 다루는 여러 특수한 기능을 제공함) 인터페이스를 잘 알면 객체 타입 정의를 할 때 다양한 방법을 활용할 수 있다. interface Person { //객체 타입 정의 readonly name: string; //읽기전용으로 설정 가능 codingLevel?: number; //선택적 프로퍼티로 설정 가능 sayHi: () => void; //type 표현방식 sayHi2 () : void; //호출시그니처, 매서드의 이름이 소괄호 앞에 붙는다. } type Func =.. 2024. 2. 11. 0059. TypeScript 공부하기8 - 함수 오버로딩, 사용자 정의 타입 가드(Custom Type Guard) 섹션 4. 함수와 타입 4강. 함수 오버로딩 함수를 매개변수의 개수나 타입에 따라서 여러 가지 버전으로 정의하는 방법을 말한다. 자바스크립트에서는 지원이 안되고, 타입스크립트에서 지원이 된다. 함수의 여러 버전들을 만들어준다. 이 버전들을 오버로드 시그니처라고 하는데, 함수의 구현부 없이 선언식만 써 놓은 것이다. - 오버로딩을 위해 매개변수별로 각각 함수의 버전을 써 놓은 것으로 이해하면 된다. function func(a: number): void; function func(a: number, b: number, c: number): void; 어떤 함수가 오버로드 시그니처를 갖고 있으면 이 함수를 호출할 때, 인수들의 타입이 구현부에 정의된 매개변수의 개수나 타입을 따르지 않고 오버로드 시그니처들의.. 2024. 2. 10. 0058. TypeScript 공부하기7 - 함수와 타입, 함수 타입 표현과 호출 시그니처, 호환성(반환값, 매개변수) 섹션 4. 함수와 타입 1강. 함수 타입 1) TypeScript 초기 패키지 설치 패키지 기본값으로 알아서 설치 npm init -y 내장 기능들에 대한 타입 선언 추가 npm install @types/node 컴파일 파일 만들기(tsconfig.json) package.json 에서 type 추가 tsconfig에서 module을 ESNext로 설정했기 때문에 필요 node가 ES module 시스템을 사용하도록 설정하는 것 scr 폴더와 index.ts 파일 만들어서 간단히 코드 써주고 tsc 컴파일하면 dist 폴더에 index.js가 생긴다. node dist/index.js ts-node src/index.ts 실행해 보면 정상적으로 로그가 출력되는 것을 볼 수 있다. 2) 함수 타입 정의 .. 2024. 2. 10. 0046. TypeScript 공부하기6 - 타입 좁히기, 서로소 유니온 타입 섹션 3. 타입스크립트 이해하기 7강. 타입 좁히기 1) 타입 좁히기 조건문 등을 이용해 넓은 타입에서 좁은 타입으로 타입을 상황에 따라 좁히는 방법을 말한다. value가 number면 toFixed, value가 string이면 toUpperCase를 쓰도록 한다. value의 타입이 number | string이지만 둘 다 사용이 가능하지는 않다. 둘 중 하나로 명확하게 표현을 해줘야 한다. // value => number : toFixed // value => string : toUpperCase function func(value : number | string) { if(typeof value === "number") { //→ 타입가드, 다른 타입이 들어오는 것을 막음 console.log.. 2024. 1. 23. 0045. TypeScript 공부하기5 - 객체 타입 호환성, 태수 타입, 타입 추론, 타입 단언 섹션 3. 타입스크립트 이해하기 4강. 객체 타입의 호환성 기본 타입 간의 호환성 특정 타입을 다른 타입으로 취급해도 괜찮은지 판단하는 것 let num1: number = 10; let num2: 10 = 10; num1 = num2; 객체 타입 간의 호환성 어떤 객체 타입을 다른 객체 타입으로 취급해도 괜찮은가? 타입스크립트 : 프로퍼티를 기준으로 타입을 정의하는 구조적 타입 시스템을 따른다. Animal이 되려면 name, color만 있으면 되기 때문에 더 넓은 영역을 포괄한다. 슈퍼타입이 Animal, 서브타입이 Dog다. 즉, Dog는 name과 color가 있기 때문에 Animal의 범주 안에 들어가는 것이다. 따라서 Dog는 Animal이 될 수 있고, 이는 업캐스팅이다. 반대로, Anim.. 2024. 1. 23. 0044. TypeScript 공부하기4 - Any, Unknown, Void, never, 업캐스팅/다운캐스팅(Feat. 타입 계층도, 타입 호환표) 섹션 2. 타입스크립트 기본 7강. Any 타입과 Unknown 타입 1) Any 특정 변수의 타입을 우리가 확실하게 모를 때 사용할 수 있는 타입 type 검사를 모두 다 통과하는 치트키 같은 타입 let anyVar: any = 10; anyVar = "Hello" anyVar = true; //불리언 anyVar = {}; //객체 anyVar = () => {}; //함수 anyVar.toUpperCase(); //문자열에 쓰는거 anyVar.toFixed(); //숫자형에 쓰는거 let num: number = 10; num = anyVar; 숫자, 문자 모두 쓸 수 있고, 함수 또한 모두 쓸 수 있다. 심지어 Any type에 숫자를 집어넣을 수도 있다. 하지만, 타입 검사를 하지 않고 넘어가.. 2024. 1. 22. 0043. TypeScript 공부하기3 - 구조적/명목적 타입 시스템, 타입 별칭, 인덱스 시그니처, 열거형 타입(enum) 섹션 2. 타입스크립트 기본 4강. 객체 객체 리터럴 타입 : { }를 이용하여 객체의 타입을 정의하는 방식 user.id에 마우스를 올려보면 property 타입에 id가 number로 나타나는 것을 볼 수 있다. 1) 구조적 타입 시스템 타입스크립트에서는 Object 같은 이런 단순한 이름으로 Type을 정의하는 것이 아니라, 이 객체를 이루는 프로퍼티나 매소드가 어떻게 생겼는지 구조를 기준으로 타입을 정의한다. 프로퍼티를 기준으로 타입을 결정하는 시스템 = Property Based Type System 타입스크립트 2) 명목적 타입 시스템 이름만으로 타입을 정의하는 것 구조적 타입 시스템과 반대의 개념 자바스크립트 3) 선택적 프로퍼티(Optional Property) id를 모르면 안 적어도 되.. 2024. 1. 22. 0042. TypeScript 공부하기2 - 원시타입, 리터럴타입, 기본타입, 배열과 튜플, 터미널 명령어 섹션 2. 타입스크립트 기본 1강. 기본타입 기본 타입 : 타입스크립트가 자체적으로 제공하는 타입 node.js 초기화 명령어 : npm init ▶ 이때 git도 초기화되는 것 같았다. 무지성으로 엔터만 치다가 읽어보니 git 관련 정보가 있었다. 타입 정보를 제공하는 typesnode 패키지 설치 명령어 : npm i @types/node package.json에 @types/node가 추가된 것을 확인할 수 있다. 그런데, 강사분 폴더를 보니 Section2 폴더에 바로 추가를 하셨다. 즉, 터미널을 이동해서 Section2 안에 package.json파일과 tsconfig.json 파일을 넣어야 한다. 그러기 위해서는 터미널 이동 명령어를 알아야 한다. cd 이동경로 : 이동경로로 디렉토리 이동 .. 2024. 1. 22. 이전 1 2 다음
