Don’t worry about failures

C와 같은 저수준의 언어가 아니면 언어들은 보통 가비지 컬렉터가 존재하며, 불필요한 메모리를 정리한다. 자바스크립트의 v8엔진 기준으로 가비지 컬렉터에 대해 알아보자. 메모리 할당 구조. 변수는 원시 변수와 참조 변수로 나누어져있다. 이 두 타입의 변수는 저장되는 방식이 약간 다르다. 원시변수는 단순하게 콜스택에 바로 저장이 되지만, 참조 변수의 경우 메모리 힙에 실제 변수가 저장이 되고, 이에 대한 주소값을 콜스텍에 저장을 한다. 가비지컬렉터는 참조 변수 관리의 역할을 한다. 즉, 참조 변수는 메모리에 저장되고 주소가 콜스텍에 저장이 된다고 했다. 여기서 콜스텍에 있는 데이터가 사라진다고 하면 메모리 힙에 있는 값을 따로 삭제하지 않으면 아무도 사용하지 않는 메모리가 되어버린다. 이렇게 됐을 때 가비지..

자바스크립트는 동적타입이기 때문에 타입 검사에 어려움이 있다. 단순히 타입 체크를 할 경우 오류를 범할 수 있다. 먼저 자바스크립트 변수에는 원시변수와 참조 변수가 존재한다. 원시변수는 string, number, boolean, undefined 등이 있다. 참조 변수는 array, Date, String, Obect, function 등이 있다. 일반적으로 typeof를 통해 타입을 체크할 경우 원시변수의 경우 별 이상없이 체크가 가능할 것이다. 하지만 참조 변수의 경우 typeof를 찍어보면 모두 object로 나올 것이다. 이는 instanceof로 구분하여 사용할 수 있다. Const arr = []; Const func = function() {}; Const date = new Date();..

es5 - 2009 출시 es6 - 2015 출시 가장 많은 변화를 가져온 es5와 es6의 차이를 알아보자. 디테일한 부분은 별도의 글로 남길 예정이고, 이 글에서는 단순 차이에 대해서 살펴보고자 한다. 1. var VS let, const 변수 선언 키워드의 변화. var의 경우 변수 선언에 있어 엄청난 자유로움을 제공해주고 있다. 하지만, 이러한 자유로움은 찾아내기 어려운 먼 암흑을 제공해주기도한다. 재할당, 동일한 네이밍 등 큰 제약 없이 모든 것이 가능하다. 이에 따라 컴파일링 과정에서 문제가 되지 않고, 코드가 완성 후 실제 테스트를 해보면서 문제가 생기는 것을 파악할 수 있다. 이는 소 잃고 외양간 고치기 식으로 버그를 찾아나서야 하고 고쳐야한다. 이러한 문제를 방지하고자 let, const..

알고리즘 문제를 풀다 새로운 문법을 발견했다. 굉장히 길었던 문제를 단 몇줄만에 끝내는 로직,, 거기서 얻어낸 문법을 간단하게 테스트 해보았다. single vertical bar 이진수로 변환 후 각 자리 버림 합을 한 후 그에 대한 결과값을 리턴해준다. 테스트는 다음과 같다. 이런게 있었다니,, 매우 놀랍다.

이해 컴파일러와 인터프리터는 사람이 이해할 수 있는 고급언어로 작성된 코드를 기계가 이해할 수 있는 기계어로 번역한 후 프로그램을 실행할 수 있게 해주는 것이다. 컴파일러 한번에 모든 코드를 고급언어에서 기계언어로 번역을한다. 이에 따라 초기에 오래걸리지만, 그 이후 runtime 때 실행 시간이 빠른 편이다. 미리 번역을 해놓았기 때문에 바로바로 컴퓨터가 이해할 수 있어 빠른 것이다. 인터프리터 한줄씩 번역을 진행을 하기 때문에 번역시간이 빠르나 실행하는 속도는 컴파일러에 비해 느리다. 컴파일러 문제점 컴파일러는 플랫폼(하드웨어)에 종속적이다. 전세계에 수 많은 종류의 하드웨어( cpu )가 존재한다. 이에 따라 a사 의 cpu에서 돌아가는 프로그램을 만들고, 타 사의 cpu에 돌려보면, 작동이 잘안된..

1. callback 2. promise 3. async 4 await 자바스크립트의 비동기에 대해 살펴보기 전에 동기와 비동기에 대해 가볍게 개념을 살펴보자. 동기와 비동기 동기와 비동기에 대한 개념을 이해할 때 '동' 이라는 단어로 연상을 시켰다. 무슨말인가 하면, 동기는 모든 사람들이 '동'일한 길만 지나간다. 비동기는 사람들 중 한명이 넘어지면 다른 길('동'일하지 않은 길)로 찾아 지나간다. 나는 이 말이 이해가 편했다. 조금 더 풀어서 개념을 챙겨보자. 동기의 경우 프로세스가 돌 때 하나의 프로세스가 딜레이가 발생했을 때 뒤에 프로세스가 앞의 프로세스가 완료될 때까지 기다렸다. 다음이 진행된다. 반면, 비동기의 경우 기다리지 않고 다음으로 바로 넘어간다. 여기서 처음에 많이 헷갈렸다. 왜 헷갈..

이벤트 캡처링 & 버블링 이벤트 등록 & 해제 이벤트 위임 방식 이번 스터디는 자바스크립트 이벤트 관리이다. 부끄럽게도 이벤트에 대한 관리를 생각해본적이 많이 없다. 이 주제에 대해 고민해본 적도 없었다. 버블링 우선, 버블링에 대해 살펴보겠다. 버블링은 내부 태그에 이벤트가 걸려오면 상위 태그로 전파되는 현상을 버블링이라고 한다. FORM DIV P 를 클릭했을 때 1. p 2. div 3. form 순으로 이벤트가 일어난다. 버블링 중단 이러한 버블링을 중단하는 함수도 제공한다. event.stopPropagation(), event.stopImmediatePropagation() FORM DIV P - event.stopPropagation() 위와 동일한 코드이지만, p 태그 내에 event.st..