개발자의 낙원

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

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

공부동기 지난주부터 자바스크립트를통해 DOM등을 이용해 HTML요소를 조작하는방법을 공부하고 있다. 이중에 자바스크립트가 querySelector를 통해 HTML에 접근할때, 인자를 CSS 선택자로 받아들이는것을 보고 한번쯤은 CSS 선택자를 정리할 필요를 느껴 포스팅을 작성한다. 이 글의 목차 1. CSS개념: HTML요소 스타일링하기 2. 기본 CSS 선택자 3. CSS 선택자 우선순위 4. CSS 선택자 결합하기 1. CSS개념: HTML요소 스타일링하기 목차로 돌아가기 CSS (Cascading Style Sheets)란? CSS는 HTML과 같은 웹페이지 문서의 디자인에 사용되는 언어이다. Cascading은 상하식, 계단식이란 뜻이다. CSS를 사용하여 디자인을 지정하는 HTML, XML, X..

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

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

WebRTC의 개념 및 용어에 대한 간단한 설명글입니다. WebRTC란? Web Real-Time Communication (웹 실시간 커뮤니케이션)의 약어이다. 이름 그대로 웹을 통해 실시간으로 정보교환을 가능케 하는 코드가 공개된 무료 (오픈소스) 기술이다. 웹 브라우저끼리, 혹은 웹 브라우저와 서버 간 플러그인 없이 통신할 수 있게 해주는 peer-to peer 앱 프로그래밍 인터페이스(API)를 제공한다. *데이터는 오디오, 비디오 및 기타 데이터를 포함하며 webRTC는 통화나 데이터 공유에 사용된다. Peer - to -Peer (P2P) 통신이란? peer: 동료, 혹은 비슷한 개체들을 뜻하는 단어이다. WebRTC의 peer는 "브라우저"를 의미한다. Peer to Peer 통신: 서버등의..

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

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

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

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": 함수지정 키워드를 사용하지 않고 변수에 함수를 저장할 수 있는 "익명함수" 기능을 제공하는 독특한..