지코딩

자바스크립트 엔진은 코드를 평가해 스코프를 기준으로 실행 컨텍스트를 생성한다. 실행 컨텍스트는 전역 실행 컨텍스트를 시작으로 호출한 순서대로 실행 컨텍스트 스택(콜 스택)에 쌓인다. 콜 스택에 쌓인 실행 컨텍스트 중 최상위 실행 컨텍스트부터 처리해 코드를 실행하는데, 이렇게 하나의 콜 스택에서 모든 작업을 처리하는 방식을 싱글스레드 방식이라고 한다. 자바스크립트엔진은 싱글스레드 방식으로 동작한다. 작업(실행 컨텍스트)을 처리하는 방식은 동기 처리와 비동기 처리로 구분된다. 동기 처리 방식은 현재 실행 중인 작업을 모두 마치고 다음 작업을 실행한다. 코드가 의도한 순서대로 실행되지만, 실행중인 작업이 길어질 경우 다음 작업이 중단된다. 반면 비동기 처리 방식은 실행중인 작업이 종료되지 않은 경우에도 다음 ..

자바스크립트 엔진은 소스코드를 실행하기에 앞서 평가해, 실행에 필요한 정보를 수집한다. 실행 컨텍스트는 평가의 결과로 만들어지는 객체로, 스코프를 기준으로 각각의 실행 컨텍스트가 생성된다. 실행 컨텍스트는 식별자를 등록하고 관리하며, 스코프 체인을 형성하는 렉시컬 환경과 코드의 실행 순서를 결정하는 실행 컨텍스트 스택으로 구성된다. 실행 컨텍스트 스택 전역 코드 또는 함수 코드가 각각의 실행 컨텍스트를 생성하면 생성된 순서대로 스택에 쌓이게(push) 된다. 스택에 쌓인 순서로 코드를 실행하는 중 새로운 실행 컨텍스트가 생성되어 스택에 쌓이면 코드 실행을 일시정지하고 스택 최상위의 실행 컨텍스트에 해당하는 코드를 먼저 실행한다. 해당 범위의 코드가 끝나면 실행 컨텍스트는 스택에서 제거되어(pop) 사라진..

ES5까지 변수를 선언할 수 있는 키워드는 var가 유일했지만, ES6에서 var의 문제점을 보완한 let과 const가 추가되었다. var console.log(a) // undefined 할당하기 전에 참조가 가능하다. var a = 1 var a = 2 console.log(a) // 2 같은스코프에서 재선언이 가능하다. if(true) { var a = 3 // 코드블록 if 가 전역스코프이기 때문에 a는 재선언됨 } console.log(a) // 3 a의 값이 변경됨 1. 재선언 같은 스코프 내에서 재선언이 가능하다. 초기화문 없이 var를 이용해 재선언 하는 경우 기존의 값이 유지되지만, 값까지 할당하는 경우 기존 변수의 값이 변경된다. 2. 함수 레벨 스코프 지역스코프가 될 수 있는 코드블..

스코프 변수나 함수를 비롯한 식별자를 선언하고 값을 할당하는 것은 참조하기 위해서이다. 이 때 식별자를 참조할 수 있는 유효 범위는 선언된 위치에 따라 결정된다. 스코프는 식별자가 유효한 범위를 의미한다. 하나의 식별자는 하나의 값을 가지기 때문에 같은 이름의 식별자는 존재할 수 없다. 하지만 스코프로 식별자의 유효 범위를 한정함으로써, 중복된 이름의 식별자를 사용할 수 있다. 전역스코프 / 지역스코프 const a = 1 function scope1() { const a = 10 console.log(a) //10 지역스코프에서 선언한 a는 지역변수 } scope1() console.log(a) //1 a는 전역변수 전역스코프는 소스코드의 가장 바깥 영역이다. 전역스코프에서 선언한 식별자는 어디서든 참..

변수 애플리케이션 안에서는 다양한 종류의 데이터가 다뤄진다. 문자가 될 수도 있고, 숫자가 될 수도 있는 데이터는 개발 과정에서 필요한 값이다. 변수는 값을 저장하고 필요할 때 꺼내서 사용하기 위해 붙이는 이름이다. 값은 메모리를 구성하는 1바이트 크기의 셀에 저장된다. 이 때 저장된 위치를 말해주는 메모리 주소를 갖게 되는데, 같은 값이어도 메모리 주소는 상황에 따라 변하기도 한다. 메모리 주소를 통해 직접 값에 접근하는 것은 그 과정에서 오류를 발생시킬 수 있기 때문에 허용되지 않는다. 변수는 값이 저장된 메모리 주소를 식별하기 위한 이름이며, 변수를 사용해 안전하게 값에 접근할 수 있다. 변수 선언 메모리 공간을 확보하고, 해당 주소를 변수 이름과 연결해 값을 저장할 수 있도록 준비하는 것이다. 변..

보호되어 있는 글입니다.

프로젝트 협업 시 각각의 개발자는 원격저장소에 저장된 프로젝트 파일을 개인이 사용하는 로컬저장소에 받아 작업한다. 새로운 작업내용이 있을 때 원격저장소의 소스코드에 작업내용을 추가하고 다시 로컬저장소에서 작업한다. git은 위의 과정에서 프로젝트의 버전을 관리하기 위한 프로그램으로 명령어로 쉽게 사용할 수 있다. git과 함께 사용되는 github은 프로젝트의 전체 소스코드를 저장할 수 있는 원격저장소를 제공하고 기존의 소스코드나 새로 추가할 내용을 좀 더 가시적으로 제공하는 웹서비스이다. 처음 git과 github를 접했을 때는 레포지토리를 생성하고, 로컬저장소와 연결해 변경사항이 있을 때 add, commit, push만을 사용해 프로젝트를 관리했다. 하지만 협업을 하고 프로젝트가 복잡해질수록 버전관..

ESLint는 일관된 스타일의 코드를 작성할 수 있도록 도와주는 도구(라이브러리?)이다. EcmaScript와 Lint를 합친 이름으로 ES문법에 적합하지 않은 코드를 찾아 오류를 표시해준다. 협업 시 Prettier와 함께 거의 필수로 사용되는데 Prettier와 목적은 비슷하지만, 기능은 다른 도구이다. Prettier는 공백, 따옴표, 줄바꿈 등 개인마다 다르게 작성하는 코드 스타일을 일관되게 바꿔주는 도구이다. 반면 ESLint는 어떤 코드를 작성하는데 있어서 일관된 형태를 유지하도록 도와준다. const doSomething = function() {} const doSomething = () => {} 예를 들어 위와 같이 함수를 선언할 때 쓰일 수 있는 다양한 방식 중 한 가지 형태로 코드를..

보호되어 있는 글입니다.

url에서 확인할 수 있는 http/https는 서버와 클라이언트가 어떤 방식으로 통신할 것인지 말해주는 protocol(규칙)의 종류 1. http - HyperText Transfer Protocol의 약자로 하이퍼텍스트를 전송하기 위한 규칙이다. - 하이퍼텍스트? 기존 텍스트(책, 신문 등)의 개념을 뛰어넘은 비선형적인 텍스트라는 의미에서 사용되는 용어이다. - http는 클라이언트의 요청(request)과 서버의 응답(response)으로 이루어지며, 보통 80번 포트를 사용한다. - 포트? 각 프로토콜이 연결되는데 사용하는 통로 번호 http요청의 구성: - 메써드, 경로, 버전이 명시되어 있는 스타트 라인 - 리퀘스트의 추가 정보를 담고 있는 헤더 - 요청 내용을 담고 있는 바디 http의 특..