전체 글

들어가며병목 현상이란 단어를 들어봤지만, 명확하게 알고 설명하지 못하는 것 같아 블로그로 포스팅하며 정확히 파악해보려 합니다. 처음에는 ‘어려움을 만났을 때 원활하게 해결하지 못하는 현상’이라고 생각했지만, 이제 명확히 이해해보겠습니다. 병목 현상(Bottleneck effect)병(bottle)의 목(neck)에 비유병목 현상이란 특정 요소의 한계로 인해 전체 시스템의 성능이 저하되는 현상을 말합니다. 병의 목이 좁아 액체가 천천히 나오는 것처럼, 시스템의 한 부분이 제 기능을 못하면 전체 시스템의 성능이 떨어집니다.예시 - 도로 교통큰 차로가 좁아지는 구간에서 발생하는 교통 체증이 좋은 예입니다. 많은 차들이 몰리면서 원활하게 흐르지 못하고 정체되는 현상을 병목 현상이라고 합니다. 컴퓨터 분야의 병목..

console.log(score);var score;위 코드를 실행시킨 결과는 어떻게 될까요?1. 참조 에러(ReferenceError)2. undefined 정답은 2번입니다. 이유는 변수 선언의 실행 시점에 연관이 있습니다. 자바스크립트 코드는 기본적으로 인터프리터에 의해 한 줄씩 순차적으로 실행되므로 console.log(score);가 가장 먼저 실행되고 순차적으로 다음 줄에 있는 코드를 실행합니다. 하지만, 변수 선언이 소스코드가 한 줄씩 순차적으로 실행되는 시점, 즉 런타임(runtime)이 아니라 그 이전 단계에서 먼저 실행되기 때문에 참조에러가 아닌 undefined가 출력되는 것입니다.즉, 자바스크립트 엔진은 변수 선언이 소스코드 어디에 있든 상관없이 다른 코드보다 먼저 실행됩니다.⇒ 변..

두 가지 용어파싱(Parsing)프로그래밍 언어의 문법에 맞게 작성된 텍스트 문서를 읽음실행하기 위해 텍스트 문서의 문자열을 토큰(token)으로 분해토큰에 문법적 의미와 구조를 반영하여 트리 구조와 자료 구조인 파스 트리(parse tree)를 생성하는 과정 렌더링(Rendering)HTML, CSS, Javascript로 작성된 문서를 파싱하여 브라우저에 시작적으로 출력하는 것을 말한다.브라우저 렌더링 과정 순서1. 브라우저는 HTML, CSS, 자바스크립트, 이미지, 폰트 파일 등 렌더링에 필요한 리소스를 요청하고 서버로부터 응답을 받는다.2. 브라우저의 렌더링 엔진은 서버로부터 응답된 HTML과 CSS를 파싱하여 DOM과 CSSOM을 생성하고 이들을 결합하여 렌더 트리를 생성한다.3. 브라우저의 ..

들어가며reduce() 함수를 사실 보면 코드가 읽히는데 사용할 순간이 쉽게 떠오르지 않아서 개념 및 원리를 정리하려 합니다. reduce()배열의 각 요소에 대해 주어진 리듀서 (reducer) 함수를 실행하고, 하나의 결과값을 반환한다. 즉, 쉽게 말하면 배열을 순회하며 각 요소에 대하여 이전의 콜백함수 실행 반환값을 전달하여 콜백함수를 실행하고 그 결과값을 반환한다. reduce 메서드의 콜백 함수 4개의 인수초기값 또는 콜백 함수의 이전 반환값reduce 메서드를 호출한 배열의 요소값reduce 메서드를 호출한 배열의 인덱스reduce 메서드를 호출한 배열 자체, 즉 thisconst arr = [1, 2, 3, 4, 5];/*previousValue : 이전 콜백의 반환값currentValue ..