Jacob's Development Blog

자바스크립트를 다루고 코딩을 하다 보면, 객체를 다루는 게 얼마나 중요한가에 대해 알게 된다. 나 또한 처음엔 몰랐다. 요즘 들어 갈증이 생기고 예전에 겉핥기 식으로 했던 공부가 근본적인 실력 향상으로 이어지지 않다는 게 느낀다. 그래서 조금 더 자세히 공부해 보자. 우리가 다루는 자바스크립트의 대부분은 객체 타입이다. 당연히 객체를 잘 다뤄야지 자바스크립트를 잘 다룰 수 있을 것이다. What is Object? 나도 그랬지만, 가끔 Object에 대해 오해를 하고 있는 사람이 많은거 같다. object(객체)란, {key: value} 이런 식의 타입만을 의미하지 않는다. 원시 타입(primitive type)을 제외한 타입은 모두 Object 타입이며, Object를 상속 받고 있는 자식들이다. 따..

(입사 초기에 사내 위키에 올렸던 내용이나, 지식 공유 차원에서 쉽게 정리하여 다시 공유한다.) 바인딩(binding) 일반적으로 A를 B에 명시적 또는 암시적인 선언에 의해 매핑하는 것. 프로그래밍에서는 개체(데이터와 코드)들을 연결(할당)하는 것이라고 생각하면 된다. 대부분의 C 기반 언어에서 변수는 선언한 위치에서 바로 생성되지만, 자바스크립트의 경우 변수 선언 방식에 따라 변수 생성 위치가 다르다. 동적 바인딩 런타임(runtime) 시에 발생하며, 실행 중인 경우 변경될 수도 있다. 정적 바인딩 컴파일시에 발생한다. 다시 말해 프로그램이 메모리에 로드될 때, 메모리 셀에 바인딩된다. Scope 자바스크립트 프로그래밍에서 가장 까다로운 부분이 아닐까 싶다. 나 역시 자바스크립트를 맨 처음 배울 때..

빅오 표기법에서 `n`은 입력의 개수를 나타낸다. `n이 무한으로 접근할 때 무슨 일이 일어날까?` O(1) `O(1)`은 입력 공간에 대해 변하지 않으며, 그래서 이를 상수 시간이라고 한다. 배열에 있는 항목을 인덱스를 사용해 접근하는 경우가 `O(1)`의 예이다. O(n) `O(n)`은 선형 시간이고 최악의 경우에 n번의 연산을 수행해야 하는 알고리즘에 적용된다. // NOTE: O(n) 알고리즘 function bigO1(n) { for (let i = 0; i < n; i++) { console.log(i); } } // NOTE: O(n^2) 알고리즘(Quadratic) function bigO2(n) { for (let i = 0; i < n; i++) { console.log(i); for(..

7 Data Types call by value와 call by reference에 대해 다루기 전에 7가지 데이터 유형을 먼저 설명하려고 한다. primitive data type - number, string, boolean, undefined, null Objects - Array, Object 여기서 중요한 점은 primitive data type은 값으로 전달되고, Objects는 참조로 전달된다. 여기서 값으로 전달된다(Call by value)는 의미는 사본을 만드는 것과 동일하다고 생각하며 되며, 좀 더 정확하게는 다른 메모리 위치에 저장된다. 아래 예제를 보자. let name = 'jacob'; let newName = name; name = 'master jung'; console.l..

(본 내용은 타입스크립트 2.8^ 버전을 기준으로 작성한다.) 조건부 타입(Conditional Type) 조건부 타입은 타입을 결정하는 새로운 방법으로 아래와 같은 문법 구조를 가지고 있다. T extends U ? X : Y 여기서 T, U, X, Y는 모두 타입이다. 위 구문을 해석해 보면 보다 쉽게 이해가 된다. "T 타입이 U에 할당 가능한 타입이면 X라는 타입이고, 아니면 Y라는 타입이다." 간단한 예제를 보자. interface Human { intro(): void; } interface Student extends Human { study(): void; } type Person = Student extends Human ? number : string; // Pserson은 number..

Typescript Generics 앞써한 포스팅에서 이미 any타입으로 타입을 느슨하게 만드는 법에 대해서는 공부하였다. 하지만, 문제가 있었다. any의 경우 타입 안정성이 떨어져서 의도치 않는 결과가 나올 수 있고, 그렇다고 한가지 타입으로만 정의하면 지정된 타입 이외에는 다른 타입을 받을 수 없기 때문에 고민이었다. 이 문제를 해결하기 위해 등장한 것이 제네릭(generic) 이다. 만약 다른 언어를 사용해봤다면 한번쯤은 들어봤을 문법이긴 하다. 사용법은 크게 다르지 않으며, 천천히 살펴보도록 하겠다. 제네릭 특징 제네릭은 다음과 같은 특징이자 장점을 가지고 있다. 컴파일시 타입 안정성을 보장한다. 캐스팅 관련 코드를 제거할 수 있다. 일단 예시 코드를 보면서 조금 더 상세하게 보겠습니다. fun..

제어문에 대해 간단히 살펴보겠습니다. 너무 쉬운 내용은 생략하고 한번더 생각해야되는 내용 위주로 소개하려고 합니다(if문 기본부터 하기에는...). Fall-through (폴스루) switch-case문에서 흔히 많이 사용하는 패턴입니다. 개발자가 의도하는 경우도 많고, 아닌 경우도 있습니다. const num: any = one; switch (num){ case "one": console.log("one이에욤"); // fall-through case "two": console.log("two이에욤"); break; default: console.log("모!!"); break; } tsconfig.json에서 컴파일 옵션을 통해 막을수도 있습니다. { "compilerOptions": { "noF..

자바스크립트 개요(ES6+) 자바스크립트(Javascript)는 일급 함수를 지원하는 언어입니다. 또한 동적 언어이며 HTML과 CSS와 함께 웹에서 가장 굴직한 줄기를 차지하고 있습니다. 참고로 Java와는 전혀 다른 언어입니다. 그런데 자바스크립트를 공부하다보면 ECMAScript, ES6, ES6+, ES7 ... 등의 말을 보게 됩니다. ES는 ECMAScript의 줄임말이며 뒤에는 버전이라고 생각하시면 됩니다(물론 ES1부터 다 있습니다). ECMAScript는 자바스크립트의 표준이며 현재도 계속 ECMA International 표준화 기구에 의해 버전이 업데이트 되고 있습니다. 그리고 ECMAScript2015를 ES6라고 하며, ES6 이후 버전을 통칭하여 "ES6+" 라고 합니다. 아래에..