it공부 (개념) 62

Decorator(데코레이터) 와 Meta-programming(메타프로그래밍): Typescript(타입스크립트) 예제

Decorator(데코레이터?) 동사 Decorate의 사전적 정의: 장식하다, 모양내다, 꾸미다 데코레이터: 장식, 장식하는 사람 타입스크립트의 데코레이터: 클래스와 클래스 멤버들의 기능을 추가 및 번경하는 "함수". 데코레이터의 특징 1. class를 수정하거나 subclass를 생성하지 않고도 기능을 변형할 수 있다. 2. 메타프로그래밍적 요소이다. 3. run-time에 실행된다. 사실 위의 특징 세 개는 모두 "메타프로그래밍"으로 요약된다. 메타프로그래밍: 사람이 직접 코드를 번경하는 것이 아니라 프로그램이 자기 자신 혹은 다른 컴퓨터 프로그램을 데이터로 취급하며 프로그램을 작성·수정하는 것을 말한다 데코레이터에 의해 클래스기능이 변형되는 시점은 run-time이다. 프로그램이 실행되는 동안에 ..

prototype(프로토타입)과 객체지향 프로그래밍: Typescript Decorator를 위한 Javascript(자바스크립트) 사전지식

Prototype?(프로토타입)의 의미 사전적 의미: proto: 원래의, 원시적인 + type: 형태, 유형, 카테고리 prototype: 원래의 형태, 원형, 임시 모델 Prototype in javascript(자바스크립트, 이하 JS): 객체의 특징, 행동에 대한 정보를 포함하고 있는 Object(오브젝트)이다. class를 이용하여 객체지향을 구현하는 다른 프로그래밍 언어와는 차별화되는 JS만의 독특한 요소이다. 원시타입(number, string, boolean, undefined, null)을 제외한 모든 JS의 요소들은 프로토타입을 가지고 있다. array(배열), object(오브젝트), fuction(함수) 같은 컴포넌트들은 이미 정의되어 있는 프로토타입을 청사진으로 삼아 생성된다. 내..

Generic(제네릭)이란? 개념 및 Typescript 예제. "any 쓰지마세요"

Generic? 사전적 의미: 일반적인, 추상적인, 포괄적인 반의어) 구체적 (specific) Generic in TypeScirpt(타입스크립트, 이하 TS) TS의 "유연한 타입 제약"을 가능케하는 문법. 하나의 함수, 또는 클래스 코드가 여러 타입의 객체를 받을 수 있게. 해준다. 그래서 코드의 간결함과 가독성, 재사용성등을 향상 시킬수 있다. TS는 타입에 제약조건을 걸어 오류가없고 깔끔한 JS코드를 생성하기위해 만들어진 언어이다. 하지만 여러타입의 객체에대해 작업을 수행하는 코드를 작성할때 타입별로 비슷한내용의 코드를 반복해서 작성해야 하는 번거로움이 있다. Generic을 사용하면 이런 수고로움을 덜 수있다. Generic은 JS에는 존재하지 않는 TS만의 구성요소이다. Genric 문법 T..

Javascript 변수선언 키워드 "var"를 사용하지 않는 이유

var? variable(변수)의 준말. JavaScript(자바스크립트 이하 JS)에서 변수를 선언할 때 사용하는 keyword이다. 왜 사용하지 않는가? var은 다음과 같은 3가지 이유 때문에 현재 사용되지 않고있다. 1. function-scope(함수범위)라는 다소 난해한 범위를 가지고 있다. 2. var로 변수를 선언하면, 변수가 선언된 block 내부에서 제일 위쪽으로 이동한다. 3. block-scope(블록범위)라는 표준적인 범위를 가진 변수선언 키워드가 도입되었다. 1. var의 난해한 범위 프로그램의 모든 곳에서 사용할 수 있는 변수를 global-variable(전역변수), 특정 함수나 {} 블록 내부에서 사용할 수 있는 변수를 local-variable(지역변수)라고 부른다. va..

union type(유니온 타입)과 type guard(타입가드)란? 개념 및 Typescript예제

Union? 사전적 의미: 조합, 결합, 연합 in Mathematics(수학에서): 합집합 타입스크립트에서: 잠재적인 타입들을 열거해 놓은 타입이다. 아직 어떤타입의 값이 대입될지 정해져 있지 않았을 때 사용한다. 열거에는 | 기호를 사용한다. ex) number | string 자바스크립트에는 존재하지 않는 타입스크립트 고유의 문법요소이다. Union Type 예제 //TypeScript 코드 //string과 number중 하나를 가질 수 있는 타입 type stringOrNumber = string | number; //string let burgerName: stringOrNumber; burgerName = 'HamBurger'; // number let price: stringOrNumber..

Intersection type(인터섹션 타입) 개념 및 Typescript 예제

Intersection? 사전적 의미: 교차로, 교집합, 어떤 것들이 가로지르는 지점 Intersection type (in Typescript): 여러 타입을 융합하여 만든 하나의 타입. "&" 연산자를 활용하여 정의한다. 융합된 타입들의 요소를 전부 가지고있다. type예제 type CheeseBurger = { numBread: number; numCheese: number; } type BeefBurger = { numBread: number; numBeef: number; } //numBread라는 공통의 요소를 가지고있는 두 타입을 정의했다. type BeefCheeseBurger = CheeseBurger & BeefBurger; //& 연산자가 바로 intersection 연산자이다. //..

interface(인터페이스) 개념 및 Typescript 예제

타입스크립트 소개 및 개발 준비 게시물의 링크는 이 글의 맨 밑에 있습니다. Art and design icons created by Freepik - Flaticon 목차. A. interface의 개념 사전적 정의, 프로그래밍 언어에서의 정의 사용이유 B. Typescript예제 1. object와 class의 청사진이 되는 interface 2. function의 청사진이 되는 interface 3. +@: readonly제어자와 option(옵션) 항목 A. Interface 개념 interface(인터페이스)란? 타입스크립트의 interface : class(클래스), object(오브젝트), function(함수) 등을 정의하기 위한 blueprint(청사진)을 제공하는 구성요소. 사전적 의미..

Singleton pattern?(싱글톤패턴) 개념 및 Typescript에서 구현하기

Miscellaneous icons created by Pixel perfect - Flaticon Singleton(싱글턴)? 일반적인 용어: "Single"에 하나를 의미하는 접미사 "ton"을 붙여서 "단독"의 의미를 강화한 단어. ex) singleton (카드): 카드 한 장 singleton (사람): 자식이 없는 사람, 혹은 가족이 없는 개인. 프로그래밍 용어 Singleton pattern: 하나의 class(클래스)가 하나의 instance(인스턴스)만 갖는 것을 보장하는 디자인. Singleton Pattern의 장점 하나의 class가 하나의 instance만 생성하도록 함으로써, 메모리 사용을 줄이고 시스템성능을 향상시킬 수 있다. instance가 하나뿐이니, 기억할 이름도 하나뿐..

VSCODE에서 TypeScript 개발 준비하기

썸네일 이미지 Microsoft icons created by Freepik - Flaticon 저번에 소개했던 TypeScript의 개발준비를 위한 설정을 해보자. https://batcave.tistory.com/33 TypeScript(타입스크립트)? 간단하게 알아보기 Typescript icons created by Freepik - Flaticon TypeScript(타입스크립트 이하 TS)란? 프로그래밍언어: JavaScript(자바스크립트, 이하 JS)의 super set(상위집합) JS에 새로운 요소를 추가하여 만든 언어. Type check(타입 batcave.tistory.com 0. Node.js, VScode설치하기 TypeScript(이하 TS)를 활용하는 데에 npm이 유용하게 ..

TypeScript(타입스크립트)? 간단하게 알아보기

Typescript icons created by Freepik - Flaticon TypeScript(타입스크립트 이하 TS)란? 프로그래밍언어: JavaScript(자바스크립트, 이하 JS)의 super set(상위집합) JS에 새로운 요소를 추가하여 만든 언어. Type check(타입체크) 기능을 통해, JS를 마치 자바처럼 static(정적)으로 프로그래밍할 수 있게 해 준다. 컴파일러: ". ts" 확장자 파일을 ". js"파일로 컴파일러 사실 TS는 그 자체로 실행가능한 언어가 아니다. TS로 작성한 모든 코드 들은 JS로 컴파일되어 실행된다. TS의 장점 js코드의 오류를 run-time 이 아닌 compile-time에 발견할 수 있다. js코드가 프로그래머의 의도와 다른 논리로 작동하는..