Reactivity와 Proxy 간단히 알아보기
·
개발/Javascript
React, Vue 같은 라이브러리나 프레임워크들을 쓰는 목적은 여러가지가 있겠지만 하나의 페이지에서 데이터를 동적으로 변경하기 위함(SPA)도 있을 것 이다. Vue에 대해 공부하던 중 Vue는 일반 객체를 제외한 반응형 객체들은 변경사항을 추적하기 위해 Proxy 객체로 변환한다는 사실을 알게 되었고 관련된 개념이 모자라 간단히 정리해보려고 한다.반응성 (Reactivity)Vue 공식 문서에선 반응성(Reactivity)에 대해, "변경"에 대한 제어를 선언적으로 수행하는 프로그래밍 패러다임이라고 나와 있다. 간단히 말해 내부에서 변경을 어떤식으로 이루어지게 하는지보다 해당 방식을 통해 변경을 이뤄지게 하겠다에 대해 중점이 맞춰진 방식이란 말이다. (여기서 선언형 프로그래밍이 이해가 되지 않는다면..
OverRiding(오버라이딩)과 OverLoading(오버로딩) 간단 정리
·
개발/Javascript
OverRiding(오버라이딩) 부모 Class로 부터 받은 메서드와 같은 이름의 내용이 다른 매서드를 재정의해 덮어 씌우는 방식. [경우] 부모 Class의 기능을 사용하지 않고 자식 Class에서 구현한 기능을 사용하고 싶은 경우. 부모 Class의 기능을 자식 Class에서 확장하고 싶은 경우. [조건] 매서드의 이름이 같아야 한다. 매서드가 받는 매개변수(parameter)가 같아야 한다. 매서드의 반환 타입이 같아야 한다. class greet { constructor() {}; hello() { return "안녕하세요"; } bye() { return "ㅃ2ㅃ2"; } } class greet_new extends greet{ hello() { return "ㅎㅇㅎㅇ"; } } const f..
[Typescript] 단일 연결 리스트 Stack 구조 만들기
·
개발/Typescript
[ String 타입만 받는 Stack ] interface Stack { readonly size: number; push(value: string): void; pop(): string; } type StackNode = { readonly value: string; readonly next?: StackNode; } class Stack_Impl implements Stack { private _size: number = 0; private head?: StackNode; constructor(private capacity: number) {} get size() { return this._size; } push(value: string) { if (this.capacity === this.size..
Typescript 알아보기
·
개발/Typescript
Typescript 알아보기 Anders Hejlsberg가 개발을 주도한 Typescript는 Javascript의 대체 언어의 하나로써, Javascript(ES5)의 Superset(상위확장, 초집합) 이다. Javascript는 인터프리터 기반의 언어로써 실행과 동시에 렌더링 되는데, Typescript는 인터프리터 방식이 아닌 컴파일 후에 실행되는 컴파일 언어이다. (전통적인 컴파일 언어와는 차이가 있어 Transpile 이라는 용어를 사용하기도 한다.) Typescript는 정적 타이핑을 지원하며, ES6(ECMAScript 2015)의 Class, Module 등과 ES7의 Decorator 등을 지원한다. (Typescript는 정적 타입의 언어이기 때문에 디버깅 하기 쉽다는 장점이 있다...