타입스크립트 16

타입스크립트에게 내 자바스크립트 모듈에대한 타입체크 및 함수설명을 시켜보자 / d.ts 파일 (Declaration)

타입체크는 타입스크립트의 가장 강력한 기능이다. 하지만 모든 자바스크립트 모듈에 자동적으로 적용되지 않는다. 타입체크가 수행되기 위해선, 사전에 체크할 타입에 대한 정보를 담고 있는 선언 파일 을 등록해 주어야 한다. 타입체크를 지원받을 기본 모듈은 다음위치에 입력되어 있다. tsconfig.json / complierOption 오브젝트 / "lib" 성분 위의 "lib" 성분이 ES6과 DOM을 포함하기에, 우리는 ES6 자바스크립트와 DOM에 대한 타입체크를 지원받을 수 있다. *예시 타입스크립트가 제공하는 정보: DOM의 querySelector 위의 사진을 보면 querySelector가 입력받는 인자의 타입 그리고 메서드에 대한 설명을 살펴볼 수 있다. * Returns the first el..

readonly modifier(readonly제어자): 한번쓰면 수정불가! /타입스크립트 예제

Access 접근제어자, abstract 제어자, static 제어자, 에 이어서 readonly 제어자에 대해 공부해 보자. 목차 1. readonly 제어자 소개 오브젝트 속성을 "읽기 전용"으로 설정하는 readonly 제어자를 소개한다. 2. 타입스크립트 예제코드 readonly 제어자로 선언가능한 속성들을 다루는 간단한 예제코드를 다룬다. 3. const와 readonly const로 선언한 변수 또한 "읽기 전용" 변수가 된다. 하지만 readonly와 const는 전혀 다른 쓰임새를 가지고 있다. 4. 자바스크립트에서 "읽기 전용" 속성 만들기 많은 타입스크립트 고유 코드들은 컴파일된 자바스크립트 코드에선 자취를 감춘다. 또 코드만 사라지는 것이 아니라 그 기능도 함께 사라진다. readon..

abstract Modifier(추상 제어자)란? 개념 및 Typescript예제

abstract? 타입스크립트의 abstract 제어자: 클래스 및 메서드선언에 사용된다. 선언한 요소의 직접적인 사용을 막는 제어자이다. abstract로 선언된 객체들은 기존 기능의 직접사용이 불가능해지고, 그것들을 상속받는 객체들을 위한 청사진 역할만 수행할 수 있게 된다. 객체지향의 핵심 특징 중 "추상화"와 "상속"을 구현하는 역할을 한다. 사전적 의미: 구체적인 형태나 성질을 갖고 있지 않은, 일반적인, 포괄적인 abstract 제어자로 선언된 클래스는 인스턴스 생성이 불가능하며, abstract 메서드는 다른 클래스에 상속 전에는 사용은커녕 기능의 정의조차 불가능하다. 즉, 상속받는 여러 클래스들의 일반적인 특징(메서드의 이름, 호출 시그니처등) 만 갖고 있으며, 상속 전에는 구체적으로 구현..

Static Modifier(스태틱 제어자)란? 개념 및 Typescript 예제

static? 타입스크립트의 static 제어자: 클래스의 구성요소에 선언에 사용되는 제어자이다. static으로 선언된 property(특성)이나 behavior(메서드)는 클래스에 직접 속하게 되며, 인스턴스가 아닌 클래스를 통해 호출된다. 사전적 의미: 정적인, 움직임이 없는 일반적인 클래스의 구성요소는 인스턴스가 생성될 때 전부 초기화되며 복제된다. 하지만 static 요소는 클래스가 메모리에 로드되는 시점에 단 한 번의 생성 및 초기화가 이루어진다. 즉 직접 호출하여 값을 바꾸지 않는 이상, 코드를 한번 실행하면 고정되어 새롭게 초기화되거나 복제되지 않는다. static 요소 호출하기 className.호출되는객체 타입스크립트예제 1. static으로 선언된 특성과 메서드는 클래스를 통해 호출이..

Access Modifier(접근제어자)란? +@ 게터 와 세터, 타입스크립트 예제. (public, private, protected)

Modifier(제어자)? Modify의 사전적 의미: 바꾸다, 완하 하다, 한정하다. 프로그래밍 언어의 Modifier: 클래스구성요소의 기능 및 접근범위를 설정하는 문법 요소. Access Modifier(접근제어자) 클래스 구성요소에 대한 접근범위를 한정하는 데 사용되는 제어자이다. 타입스크립트는 public, private, protected 이렇게 세 개의 접근제어자를 제공한다. 이 접근제어자들은 타입스크립트의 고유 구성요소로, 자바스크립트에는 포함되지 않는다. public: 어디에서나 접근 가능하다. protected: 선언된 클래스와 그 클래스를 상속받는 클래스내부에서만 접근할 수 있다. private: 선언된 클래스 내부에서만 접근이 가능하다 접근 제어자/ 접근위치 클래스 내부 서브 클래스..

Typescript "Type" 키워드 사용하기

Type(타입 키워드)? 프로그래머의 개별적 의도에 맞는 타입을 선언하는 기능을 제공하는 문법이다. type typeName = 타입형태 왜 필요한가? 타입스크립트의 "타입체크"는 "프로그래머의 의도"에 맞는 타입의 값만을 집어넣게 해 주는 강력한 기능이다. 타입스크립트의 존재 이유 그 자체라고 할 수 있다. 하지만 타입스크립트가 boolean, number, string 등등의 "기본타입"만을 체크해 준다면 자바스크립트의 실행과정에 발생하는 괴상한 오작동은 막을 수 있지만, 개발자에게 자료의 구조 및 요구사항에 대한 힌트를 주어 실질적으로 개발을 돕기엔 부족하다. 그래서 타입스크립트는 임의의 "타입"을 직접 정의할 수 있게 해 주고, 그러한 커스텀 타입에 대한 타입체크 기능도 제공하고 있다. Type키..

다형성을 구현하는방법: 호출 시그니쳐와 함수오버로딩 (타입스크립트 예제). polymorphism, call signature, function overloading, typescript

4줄 요약) 1. 다형성은 "객체지향"의 특성 중 하나로, 한 가지 형태로 여러 가지 기능을 수행하는 특성을 뜻한다. 2. 호출 시그니쳐는 함수가 받아들이는 인자의 타입 및 형태이다. 3. 함수 오버로딩은 한개의 함수가 여러 개의 호출 시그니쳐 및 그에 대응되는 실행기능을 갖는 것을 말한다. 4. 하나의 이름을 갖는 함수가 여러 호출시그니처를 가짐으로써 "다형성" 특성이 구현된다. prototype(프로토타입)과 객체지향 프로그래밍: Typescript Decorator를 위한 Javascript(자바스크립트) 사전 Prototype?(프로토타입)의 의미 사전적 의미: proto: 원래의, 원시적인 + type: 형태, 유형, 카테고리 prototype: 원래의 형태, 원형, 임시 모델 Prototype..

자바스크립트 ES6 arrow function(화살표 함수) 개념 및 타입스크립트 예제 +@ python lambda

ES6 시리즈 1. const와 let의 등장: "var 쓰지 마세요" https://batcave.tistory.com/39 Javascript 변수선언 키워드 "var"를 사용하지 않는 이유 var? variable(변수)의 준말. JavaScript(자바스크립트 이하 JS)에서 변수를 선언할 때 사용하는 keyword이다. 왜 사용하지 않는가? var은 다음과 같은 3가지 이유 때문에 현재 사용되지 않고있다. 1. function-s batcave.tistory.com 2. arrow function: 화살표 함수 arrow function(fat arrow): 개념 화살표 함수는 "function": 함수지정 키워드를 사용하지 않고 변수에 함수를 저장할 수 있는 "익명함수" 기능을 제공하는 독특한..

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(함수) 같은 컴포넌트들은 이미 정의되어 있는 프로토타입을 청사진으로 삼아 생성된다. 내..