You Can Become A
늦게 시작해도 누구든지 노력하면 개발자가 될수 있어요 !
📘 타입스크립트 Enum 타입 정복하기
고급 타입 Enum enum은 C, Java와 같은 언어를 다뤄봤으면 한번쯤 들어보는 흔하게 쓰이는 타입으로 특정 값(상수)들의 집합을 의미한다. 타입스크립트의 튜플 타입이 특정 타입이나 값을 고정하는 배열이라면, Enum은 특정 값을 고정하는 또다른 독립된 자료형이라고 보면 된다. enum Color { Red, Green, Blue, } // enum 타입 let c: Color; // enum 타입 변수 선언 c = Color.Green; // enum 타입 변수에 enum 값 할당 c = 'Hello'; // Error - enum 타입 변수에는 반드시 설정된 enum 값 (Red, Green, Blue)만 올수 있음 let d: Color.Red; // enum 값을 타입 자체로도 사용할 수가 ..
📘 타입 추론 / 타입 호환 / 타입 단언 / 타입 가드 💯 총정리
타입 추론 (Inference) 타입 추론이란, 개발자가 굳이 변수 선언할때 타입을 쓰지않아도 컴파일이 스스로 판단해서 타입을 넣어주는 것을 말한다. 예를들어 다음과 같이 타입을 생략한채 변수를 선언하면 대입되는 값의 자료형태를 보고 컴파일러가 num 변수는 number 타입인걸 추론해서 자동으로 넣게 되는 원리이다. let num = 12; num = 'Hello type!'; // Error - TS2322: Type '"Hello type!"' is not assignable to type 'number'. 위와 같이 num에 대한 타입을 따로 지정하지 않더라도 일단 num 변수는 number로 간주되는 걸 확인 할 수 있다. 타입 추론은 함수의 리턴 타입에도 요긴하게 쓰일 수 있다. 다음과 같이 ..
📘 타입스크립트 클래스 · 객체 지향 문법 💯 총정리
타입스크립트의 객체 지향(OOP) 자바스크립트는 프로토타입 기반 언어라, 객체 지향으로 코드를 구성하려면 많은 애로 사항이 있었다. 그러다 ES6으로도 알려진 ECMAScript 2015를 시작으로 클래스 문법이 추가되면서 JavaScript 프로그래머들은 이런 객체-지향적 클래스-기반의 접근 방식을 사용해서 애플리케이션을 만들 수 있게 되었다. 그리고 자바스크립트의 바톤을 그대로 이은 타입스크립트에서는 더욱 더 객체 지향 문법들을 더 끌어 모아, 보다 자바(JAVA) 스럽게 클래스를 구성 할수 있다. 이번 타입스크립트 객체 지향 강의에서는 자바(JAVA) 혹은 자바스크립트(JavaScript)의 객체 지향 문법을 미리 익혀두는 것을 강력하게 추천한다. 자바스크립트의 클래스 문법은 다음 포스팅을 참고하길..
📘 타입스크립트 인터페이스 활용 💯 총정리
타입스크립트 Interface 인터페이스는 자바(JAVA)를 배운 분들은 매우 익숙하면서도 반가운 단어일 것이다. 다만 자바에서의 인터페이스는 추상 메소드와 상수만을 정의한 클래스를 위주로 다루지만, 타입스크립트(TypeScript)의 인터페이스는 객체를 위주로 다룬다는 점에서 차이가 있다. 타입스크립트의 인터페이스는 두개의 시스템 사이에 상호 간에 정의한 약속 혹은 규칙을 포괄하여 의미한다. 혹은 객체의 껍데기 또는 설계도라고 할 수 있다. 즉, 프로그래밍에서 클래스 또는 함수의 '틀' 을 정의하는 것처럼, 타입의 '틀'로서 사용할 수 있는 것이 인터페이스 인 것이다. 여러 함수가 특정한 시그니처를 동일하게 가져야 할 경우 또는 여러 클래스가 동일한 명세를 정의해야하는 경우 인터페이스를 통해서 정의할 ..
📘 타입스크립트 함수 타입 다루기 💯 총정리
타입스크립트 함수 표현 타입스크립트에서 함수를 표현하는 방법은 머리 아플 정도로 여러가지이다. 내가 쓰기 편한 함수 선언 방식을 이용하면 되겠지만, 남이 만든 라이브러리나 코드를 보기 위해서는 어떤 타입스크립트 함수 표현식이 있는지 알 필요가 있다. 일반적인 함수 정의 자바스크립트에서 함수를 표현하는데 크게 3가지 표현식이 있다. 여기에 그냥 매개변수와 리턴값만 타입만 지정해주면 되니 그렇게 난해하지는 않다. 함수 선언식 //* 함수 선언식 function myFunc1(x: number, y: number): number { return x + y; } 함수 표현식 //* 함수 표현식 let myFunc2 = function (x: number, y: number): number { return x +..
📘 타입스크립트 타입 선언 & 종류 💯 총정리
타입 - Boolean 단순한 참(true) / 거짓(false) 값 let isBoolean: boolean; isBoolean = true; let isDone: boolean = false; 타입 - Number 정적 타입이라 해서 C / JAVA 처럼 int, float, double 타입은 없고, Javascipt의 number 자료형을 그대로 사용한다. 16진수, 10진수, 2진수, 8진수 리터럴도 지원한다. let num: number; let integer: number = 6; let float: number = 3.14; let hex: number = 0xf00d; // 61453 let binary: number = 0b1010; // 10 let octal: number = 0o7..
📘 타입스크립트 컴파일 설정 - tsconfig 옵션 총정리
타입스크립트 컴파일 설정 tsconfig.json은 타입스크립트를 자바스크립트로 변환 시키는 컴파일 설정을 한꺼번에 정의 해놓는 파일이라고 보면 된다. 프로젝트를 컴파일 하는데 필요한 루트 파일, 컴파일러 옵션 등을 상세히 설정할 수 있다. 보통 tsconfig.json 파일은 TypeScript 프로젝트의 루트 디렉토리(Root Directory)에 위치된다. 그래서 tsconfig.json 파일이 프로젝트에 있다면 vscode는 우리가 타입스크립트로 개발한다는 것을 인식하게 되는 것이다. tsconfig에서 옵션들을 미리 정의해 놓으면, 더이상 컴파일 할때 명령어에 일일히 대상 파일이나 옵션을 지정하지 않아도 된다. 그래서 tsc 나 ts-node 명령어를 그냥 실행하게 되면, 현재 폴더에 있는 ts..
📘 TypeScript 소개 & 개발 환경 구성하기
타입스크립트 소개 자바스크립트는 동적 타입 언어로서 자유도가 높아 진입 장벽이 낮고 생산성이 높은 대신, 형식이 정해져 있지 않기 때문에 오류(버그)가 런타임 중에 발생한다거나, 또는 팀원간에 코드를 통한 의사소통에 어려움이 생긴다는 단점이 있다. 예를들어 자바스크립트는 다음과 같은 정신 나간 코드에 대해서 어떠한 오류 없이 스스로 판단해 결과를 만들어 버린다. 자바스크립트는 최대한 개발자의 실수에 대해서 오류를 자제하고 실행하도록 유도하여 위와 같은 결과가 나오는 것이다. 이는 생산성을 확대라는 장점이 있지만 의도치 않는 버그를 마구 내뿜는다는 아주 큰 단점이 생기게 된다. C#과 Java 같은 체계적이고 정제된 언어들에서 사용하는 강한 타입 시스템은 높은 가독성과 코드 품질 등을 제공할 수 있고 런타..
